<!DOCTYPE html>
<html>
<head>
	<title>FC-python wrapper</title>

<!-- If you are using downloaded FusionCharts libraries, uncomment the below code   -->
<!--

	{% load static %} 
   	<script type="text/javascript" src="{% static "fusioncharts/fusioncharts.js" %}"></script>
   	<script type="text/javascript" src="{% static "fusioncharts/themes/fusioncharts.theme.fusion.js" %}"></script>
	
-->

   <script type="text/javascript" src="//cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
   <script type="text/javascript" src="//cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
    <script>
        updateData = function () {
           var value = document.getElementById("dial-val").value;
           FusionCharts("ex1").setDataForId("dial1",value);
       }
    </script>
</head>
<body style="font-family:'Helvetica Neue', Arial; font-size: 16px;">
	<h3>{{ chartTitle|safe }}</h3>
	<div id="chart-1">{{ output|safe }}</div>
	<br/>
	<div>
            <label for="dial-val">Input dial value</label>
            <input name="dial-val" id="dial-val" type= "number"/>
            <input type ="button" name ="update dial" value ="update dial"onclick ="updateData()" />
	</div>
	<br/>
	<a href="/">Back</a>
</body>
</html>