diff options
Diffstat (limited to 'pyaggr3g470r/templates')
| -rw-r--r-- | pyaggr3g470r/templates/history.html | 74 |
1 files changed, 74 insertions, 0 deletions
diff --git a/pyaggr3g470r/templates/history.html b/pyaggr3g470r/templates/history.html new file mode 100644 index 00000000..0194cb89 --- /dev/null +++ b/pyaggr3g470r/templates/history.html @@ -0,0 +1,74 @@ + {% extends "layout.html" %} + {% block head %} +{{ super() }} +<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> +<style type="text/css"> +rect { + fill: purple ; + padding: 7px; + margin: 2px; + color: white; + } +rect:hover + { + opacity : 0.5; + } +</style> +{% endblock %} + +{% block content %} +<div class="container"> +<h1>History</h1> +<div align="center" id="pie_chart"> + <div class="chart"> + </div> + + +<script type="text/javascript"> +function createGraph(dataset, w, h) { + var barPadding = 1; + + //Create SVG element + var svg = d3.select("#pie_chart .chart") + .append("svg") + .attr("width", w) + .attr("height", h); + + svg.selectAll("rect") + .data(dataset) + .enter() + .append("rect") + .on("click", clickEvent) + .attr("x", function(d, i) { + return i * (w / dataset.length); + }) + .attr("y", function(d) { + return h - (d * 4); + }) + .attr("width", w / dataset.length - barPadding) + .attr("height", function(d) { + return d * 4; + }); +} + +function clickEvent(d){ + //var op = prompt("Please enter the value", ""); + alert(d); + +}; + + + +var w = 800; +var h = 100; +var dataset = [ 12, 10, 13, 19, 21, 25, 22, 18, 15, 13, + 11, 12, 15, 20, 18, 17, 16, 18, 23, 25 ]; + +createGraph(dataset, w, h); + + +</script> + + +</div> +{% endblock %}
\ No newline at end of file |