Question

我正在尝试使用D3热图：http://bl.ocks.org/tjdecke/5558084，但无法更改代码。该示例显示了.tsv文件的使用，但我想使用.json文件。

所以代替tsvFiles代码如下所示：

var heatmapChart = function(tsvFile) {
        d3.tsv(tsvFile,
        function(d) {
          return {
            day: +d.day,
            hour: +d.hour,
            value: +d.value
          };
        },
        function(error, data) {
          // eliminate code
        });  
      };

我尝试过更改为json（但不起作用）：

d3.json("./data/data.json",
            function(d) {
                    return {
                        day: +d.day + 1,
                        hour: +d.hour + 1,
                        value: +d.value
                    };
                },

                function(error, data) {
                     // eliminate error
 });

Answer 1

d3.json不接受访问者函数，只有d3.csv和d3.tsv接受它（访问者函数是“data.json”和“function（错误，数据）之间的函数）“在你的片段中。”

因此，请将d3.json功能更改为：

d3.json("./data/data.json",  function(error, data) {
    //the rest of your code
});

并且，在“其余代码”中，编写访问器函数。在你的情况下，像这样：

data.forEach(function(d) {
    return {
         day: +d.day + 1,
          hour: +d.hour + 1,
          value: +d.value
     };
 });

此外，只有当您的JSON完全模仿由d3.tsv创建的对象数组的结构时，这才有效。

D3热图将代码转换为使用json而不是tsv

1 个答案: