Permalink
Browse files

Beautiful graphing of grade distribution

  • Loading branch information...
1 parent 1d6ba57 commit c123a9a987e798875ed5eea02d268676de7a377f @thedjpetersen committed Jun 15, 2011
Showing with 45 additions and 7 deletions.
  1. +0 −2 main/templatetags/utilities.py
  2. +45 −5 transcript/templates/transcript/report_card.html
@@ -5,5 +5,3 @@
@register.simple_tag
def dict_key_lookup(the_dict, key):
return the_dict.get(key, '')
-
-
@@ -1,5 +1,7 @@
{% extends "application.html" %}
+{% load filters %}
+
{% block header %}
<link rel="stylesheet" type="text/css" href="/site_media/stylesheets/report_card.css" />
<script type="text/javascript" src="/site_media/javascripts/protovis-r3.2.js" ></script>
@@ -58,21 +60,59 @@
x = pv.Scale.ordinal(pv.range({{ grade_distribution|length}})).splitBanded(0, w, 4/5)
y = pv.Scale.linear(0, 15).range(0, h);
- var vis = new pv.Panel().width(w).height(h).bottom(20).left(20).right(5).top(5);
+ var vis = new pv.Panel()
+ .width(w)
+ .height(h)
+ .bottom(20)
+ .left(20)
+ .right(5)
+ .top(5);
+
+
- var bar = vis.add(pv.Bar).data(data).left(function()x(this.index)).width(x.range().band).bottom(0).height(y);
+ var bar = vis.add(pv.Bar)
+ .data(data)
+ .left(function()x(this.index))
+ .width(x.range().band)
+ .bottom(0)
+ .height(y)
+ .fillStyle(pv.colors(
+ {% for grade in grade_distribution %}
+ "hsl({{ grade_distribution|length|colorize:forloop.counter }},100%,40%)"
+ {% if not forloop.last %}
+ ,
+ {% endif %}
+ {% endfor %}
+ ).by(pv.index));
- bar.anchor("top").add(pv.Label).textStyle("white").text(function(d) d);
+ bar.anchor("top").add(pv.Label)
+ .textStyle("white")
+ .text(function(d) d);
letter_grades = [{% for grade in grade_distribution %}
{% for key, value in grade.items %}
"{{key}}",
{% endfor %}
{% endfor%}]
- bar.anchor("bottom").add(pv.Label).textMargin(5).textBaseline("top").text(function() letter_grades[this.index]);
+ bar.anchor("bottom")
+ .add(pv.Label)
+ .textMargin(5)
+ .textBaseline("top")
+ .text(function() letter_grades[this.index]);
- vis.add(pv.Rule).data(y.ticks()).bottom(function(d) Math.round(y(d)) - .5).strokeStyle(function(d) d ? "rgba(255,255,255,.3)" : "#000").add(pv.Rule).left(0).width(5).strokeStyle("#000").anchor("left").add(pv.Label).text(function(d) d);vis.render();
+ vis.add(pv.Rule)
+ .data(y.ticks())
+ .bottom(function(d) Math.round(y(d)) - .5)
+ .strokeStyle(function(d) d ? "rgba(255,255,255,.3)" : "#000")
+ .add(pv.Rule)
+ .left(0).width(5)
+ .strokeStyle("#000")
+ .anchor("left")
+ .add(pv.Label)
+ .text(function(d) d);
+
+ vis.render();
</script>
</div>

0 comments on commit c123a9a

Please sign in to comment.