_macros.html: mod ensure different adjecent colors

This commit is contained in:
Spencer Krum
2013-08-29 12:00:24 -07:00
committed by Daniele Sluijters
parent e1603608bc
commit 0422b2ccd0

View File

@@ -31,20 +31,22 @@
<script src="{{url_for('static', filename='js/Chart.js')}}"></script> <script src="{{url_for('static', filename='js/Chart.js')}}"></script>
<canvas id="factChart" width="400" height="400"></canvas> <canvas id="factChart" width="400" height="400"></canvas>
<script type="text/javascript"> <script type="text/javascript">
var data = [ var colors = [ "#F38630", "#E0E4CC", "#69D2E7", "#D11151", "#787BE3", "#B59370", "#B30202" ];
{% set color_list = ["#F38630", "#E0E4CC", "#69D2E7", "#D11151", "#787BE3", "#B59370", "#B30202"] %} var len_colors = colors.length;
var data = [
{% for fact in facts|groupby('value') %} {% for fact in facts|groupby('value') %}
{ {
label: "{{ fact.grouper }}", label: "{{ fact.grouper }}",
color: "{{ color_list|random }}",
value: {{ fact.list|length }} value: {{ fact.list|length }}
}, },
{% endfor %} {% endfor %}
{ {
value: 0, value: 0,
color: "#000000"
} }
] ]
for (var i = 0; i < data.length; i++) {
data[i].color = colors[i % len_colors];
}
var ctx = document.getElementById("factChart").getContext("2d"); var ctx = document.getElementById("factChart").getContext("2d");
new Chart(ctx).Pie(data.sort(function(a,b) { return parseFloat(a.value) - parseFloat(b.value)})); new Chart(ctx).Pie(data.sort(function(a,b) { return parseFloat(a.value) - parseFloat(b.value)}));
</script> </script>