如何将 d3.csv 更改为 d3.json答案

【问题标题】：how to change d3.csv to d3.json如何将 d3.csv 更改为 d3.json
【发布时间】：2016-07-26 13:49:31
【问题描述】：

谁能告诉我如何将以下 d3.csv 更改为 d3.json

d3.csv("sp500.csv", type, function(error, data) {
    console.log(data);
      x.domain(d3.extent(data.map(function(d) { return d.date; })));
      y.domain([0, d3.max(data.map(function(d) { return d.price; }))]);
      x2.domain(x.domain());
      y2.domain(y.domain());

      focus.append("path")
          .datum(data)
          .attr("class", "area")
          .attr("d", area);

      focus.append("g")
          .attr("class", "x axis")
          .attr("transform", "translate(0," + height + ")")
          .call(xAxis);

      focus.append("g")
          .attr("class", "y axis")
          .call(yAxis);

      context.append("path")
          .datum(data)
          .attr("class", "area")
          .attr("d", area2);

      context.append("g")
          .attr("class", "x axis")
          .attr("transform", "translate(0," + height2 + ")")
          .call(xAxis2);

      context.append("g")
          .attr("class", "x brush")
          .call(brush)
        .selectAll("rect")
          .attr("y", -6)
          .attr("height", height2 + 7);
    });}

以上代码取自http://bl.ocks.org/mbostock/1667367我需要从json文件中读取数据，

【问题讨论】：

你准备好sp500.json了吗？如果你有那么你可以直接使用d3.json("path/to/file.json", function)。请求服务端返回 JSON 格式的数据
我已经准备好了 sp500.json...请让我知道要在 d3.json("sp500.json",function(?)) 处添加的函数

标签： javascript json csv d3.js

【解决方案1】：

使用 d3.json 函数，所有代码都依赖于 json 文件返回的数据结构

d3.json("sp500.json", function(error, data) {
console.log(data);
//rest all your code depend on structure of data
  x.domain(d3.extent(data.map(function(d) { return d.date; })));
  y.domain([0, d3.max(data.map(function(d) { return d.price; }))]);
  x2.domain(x.domain());
  y2.domain(y.domain());

  focus.append("path")
      .datum(data)
      .attr("class", "area")
      .attr("d", area);

  focus.append("g")
      .attr("class", "x axis")
      .attr("transform", "translate(0," + height + ")")
      .call(xAxis);

  focus.append("g")
      .attr("class", "y axis")
      .call(yAxis);

  context.append("path")
      .datum(data)
      .attr("class", "area")
      .attr("d", area2);

  context.append("g")
      .attr("class", "x axis")
      .attr("transform", "translate(0," + height2 + ")")
      .call(xAxis2);

  context.append("g")
      .attr("class", "x brush")
      .call(brush)
    .selectAll("rect")
      .attr("y", -6)
      .attr("height", height2 + 7);
});}

请参阅 https://github.com/mbostock/d3/wiki/Requests 获取文档

【讨论】：