字典数据 ito d3 折线图 - 服务器端的 Django Python

Question

我有一个日期时间和值的字典对象。我已按以下格式相应地设置了我的轴；

var parseDate = d3.time.format(""d %b %Y %H:%M:%S %p").parse;

    var x = d3.time.scale()
        .range([0, width]);

    var y = d3.scale.linear()
        .range([height,0]);

    var xAxis = d3.svg.axis()
        .scale(x)
        .orient("bottom");

    var yAxis = d3.svg.axis()
        .scale(y)
        .orient("left");

我无法理解的是如何写一个等效的；

        var line = d3.svg.line()
        .x(function (data) { return x(data.property1); })
        .y(function (data) { return y(data.property2); });

但是从我的 django 视图中使用字典。我是否应该用我的数据字典返回一个 render_to_response 并相信 data.property1 会将我的 x 值设置为我在视图中生成的值。或者我应该在上述函数中调用某种 ajax 来通过 HttpResponse(data) 返回数据。

我是一个 javascript 和 d3 菜鸟，但没有足够的时间学习足够详细的知识，谢谢！

Answer 1

你是对的，你应该使用HttpResponse()。

D3.js 有一个漂亮的 d3.json 方法，它将在 URL“/myDataURL/”处执行 GET 请求并将响应解析为 JSON 对象：

d3.json("/myDataURL/", function(error, data) {
    // ... (Use `data` to load the visualization.)
});

这意味着您可以轻松地从 Django 以 JSON 格式发送 dict：

import json
def myView(request):
    // ... Prepare the `data` dict.
    return HttpResponse(json.dumps(data), content_type="application/json")

注意：在最近的 Django 1.7+ 中使用带有 content_type 的 HttpResponse 可以通过使用 JsonResponse()

来简化

---

现在将它们放在一起，如果您想将数据实际加载为（例如）折线图中的线条，您可以使用 (source)：

var line = d3.svg.line()
    .x(function(d) { return x(d.date); })
    .y(function(d) { return y(d.close); });

d3.json("/myDataURL/", function(error, data) {
  data.forEach(function(d) {
    d.date = parseDate(d.date);
    d.close = +d.close;
  });

  x.domain(d3.extent(data, function(d) { return d.date; }));
  y.domain(d3.extent(data, function(d) { return d.close; }));

  // ... Set up the axes. See the source above for detailed instructions.

  svg.append("path")
      .datum(data)
      .attr("class", "line")
      .attr("d", line);
});