我正在尝试将 django 的 views.py 中的查询集传递给 d3.js。
View .py :
定义索引(请求): qs = DCPOWERSTATS.objects.all().values('TS','PuE').order_by('TS') 返回渲染(请求，'dashboard/dash.html'，context=qs})
破折号.html :
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.chart div {
font: 10px sans-serif;
background-color: steelblue;
text-align: right;
padding: 3px;
margin: 1px;
color: white;
}
</style>
<div class="chart"></div>
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
var data = {{ data_json }};
var x = d3.scale.linear()
.domain([0, d3.max(data)])
.range([0, 420]);
d3.select(".chart")
.selectAll("div")
.data(data)
.enter().append("div")
.style("width", function(d) { return x(d) + "px"; })
.text(function(d) { return d; });
</script>
我需要在 views.py 和 dash.html 中进行更改以创建如下内容: https://bl.ocks.org/mbostock/3885304
以前的所有答案都令人困惑。我需要 views.py 和 dash.html 的解决方案。我还需要知道将查询集结果发送到 javascript 的完美方式。
谢谢!
最佳答案
您需要将模型转换为普通列表/字典，以便能够将它们转换为 JSON。您决定在查询集上使用 values()。还有django serialization .
尽管有序列化，您在这里有两个选择。
JSON 返回 View
或者您使用 JsonResponse 创建一个直接返回 JSON 数据的 View .
from django.http import JsonResponse
def index(request):
qs = DCPOWERSTATS.objects.all().values('TS','PuE').order_by('TS')
# slice the queryset to hit the database and convert into list
return JsonResponse(qs[:])
您现在可以使用 ajax 调用在客户端加载此数据。
html(使用 jQuery)
// assuming you have registered your view at '/dcpowerstats'
$.ajax({
url: "http://example.com/dcpowerstats",
success: function(data) {
console.log(data);
}
});
将 JSON 传递给您的模板
或者您可以使用 将 JSON 数据直接渲染到 HTML 模板中。在这种情况下，您应该将序列化数据添加到 View 并在那里使用模板标签。
查看
import json
from django.shortcuts import render
def index(request):
qs = DCPOWERSTATS.objects.all().values('TS','PuE').order_by('TS')
# slice the queryset to hit the database and convert into list
context = {'data_json': json.dumps(qs[:])}
return render(request, 'dashboard/dash.html', context=context)
html
<script>
var data = {{ data_json|safe }};
</script>
选择哪种方式取决于您的前端和偏好。
如果您只需要在 View javascript 中提供一些静态数据，我会选择模板选项。
如果您的前端需要能够动态加载不同的东西并且数据量更大，请选择第二个选项。在这种情况下，我也会考虑使用 django rest framework .
关于python - 将 json 数据从 django 发送到 d3.js，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43617277/