我想将django的views.py中的queryset传递给d3.js.将json数据从django发送到d3.js

views.py：

DEF指数（请求）： QS = DCPOWERSTATS.objects.all（）的值（ 'TS'， 'PUE'）ORDER_BY（ 'TS'）返回渲染（要求， '仪表盘/ dash.html'，背景= QS}）

dash.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提供解决方案。我也需要知道将queryset结果发送给javascript的完美方式。

谢谢！

来源

2017-04-25 sach20

您需要将模型转换为普通列表/字典才能将它们转换为JSON。您决定在查询集上使用values()。还有django serialization。

尽管序列化，你在这里有两个选择。

JSON返回意见

要么你创建直接使用JsonResponse返回JSON数据的视图。

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模板。在这种情况下，您应该将您的序列化数据添加到视图并在其中使用模板标记。

视图

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>

哪种方式挑选取决于你的前端和喜好。

如果你只是需要一些静态数据在你的意见JavaScript的，我会选择模板选项。

如果您的前端需要能够动态加载不同的东西，并且数据量更大，请选择第二个选项。在这种情况下，我也会考虑使用django rest framework。

来源

2017-04-25 19:46:12 dahrens

+1模板/ django rest框架。如果您的数据仅流向客户端，则模板无问题。但是当你开始不得不接受PUT，POST等的时候，DRF就是要走的路。 – DataSwede

所以，如果我需要动态的内容在客户端进行ajax调用是首选？ – sach20

由于@DataSwede注意到这里的数据流也具有相关性。如果您的数据只从服务器流向客户端，那么模板方法是合适的，但如果您的数据也需要回流，则应考虑采用RESTful方法。 – dahrens

将json数据从django发送到d3.js

回答

JSON返回意见

JSON传递到您的模板

相关问题