由于D3.js v3具有从外部资源 ¹ 加载数据的很好的方法集合，因此最好不要将数据嵌入页面中，而只需加载它。
这将是一个示例答案。
让我们从模型定义开始：
# models.pyfrom django.db import modelsclass Play(models.Model): name = models.CharField(max_length=100) date = models.DateTimeField()
urlconf：
# urls.pyfrom django.conf.urls import urlfrom .views import graph, play_count_by_monthurlpatterns = [ url(r'^$', graph), url(r'^api/play_count_by_month', play_count_by_month, name='play_count_by_month'),]
我们使用两个URL，一个返回html（视图graph），另一个使用url（视图play_count_by_month）作为api，仅以JSON形式返回数据。
最后是我们的观点：
# views.pyfrom django.db import connectionsfrom django.db.models import Countfrom django.http import JsonResponsefrom django.shortcuts import renderfrom .models import Playdef graph(request): return render(request, 'graph/graph.html')def play_count_by_month(request): data = Play.objects.all() .extra(select={'month': connections[Play.objects.db].ops.date_trunc_sql('month', 'date')}) .values('month') .annotate(count_items=Count('id')) return JsonResponse(list(data), safe=False)在这里，我们定义了一个视图以将数据返回为JSON，请注意，由于我使用SQLite进行了测试，因此我做了一些更改，使其与数据库无关。
并遵循我们的·模板，该模板显示按月播放的图表：
<!DOCTYPE html><meta charset="utf-8"><style>body { font: 10px sans-serif;}.axis path,.axis line { fill: none; stroke: #000; shape-rendering: crispEdges;}.x.axis path { display: none;}.line { fill: none; stroke: steelblue; stroke-width: 1.5px;}</style><body><script src="http://d3js.org/d3.v3.js"></script><script>var margin = {top: 20, right: 20, bottom: 30, left: 50}, width = 960 - margin.left - margin.right, height = 500 - margin.top - margin.bottom;var parseDate = d3.time.format("%Y-%m-%d").parse; // for dates like "2014-01-01"//var parseDate = d3.time.format("%Y-%m-%dT00:00:00Z").parse; // for dates like "2014-01-01T00:00:00Z"
