title: Passing data from Django to D3
body: <p>I'm trying to write a very basic bar graph using Django and D3.js. I have an object called play with a datetime field called date. What I want to do is show number of plays over time grouped by month. Basically I have two questions:</p>
  
  <ol>
  <li>How do I get these grouped by month with a count of the number of plays in that month</li>
  <li>What is the best way to get this information from Django into something usable by D3.</li>
  </ol>
  
  <p>Now I have looked at some other answers on here and have tried </p>
  
  <pre><code>json = (Play.objects.all().extra(select={'month': "extract(month FROM date)"})
  .values('month').annotate(count_items=Count('date')))
  </code></pre>
  
  <p>This gets close to trhe information I want but when I try to output it in the template it comes out as the following (with Ls) on the end of the months. This means that obviously it isn't valid js (no qoutes) and I don't really want the Ls on the end there anyway.</p>
  
  <p>Template:</p>
  
  <pre><code>    &lt;script&gt;
          var test ={{ json|safe }};
          alert("test");
  
      &lt;/script&gt;
  </code></pre>
  
  <p>output:</p>
  
  <pre><code>var test = [{'count_items': 10, 'month': 1L}, {'count_items': 5, 'month': 2L}];
  </code></pre>
  
  <p>I have also tried json.dumps on this data but I get told it isn't valid JSON. This feels like it should be a lot more straightforward to do in Django so maybe I am headed down the worng path entirely.</p>