0

我的代码：

function d3_chart() {
      // sample data array
      // instantiate d3plus
      var visualization = d3plus.viz()
        .container("#viz")  // container DIV to hold the visualization
        .data("./extra/acc.csv", {"filetype": "csv"})  // data to use with the visualization
        .type("line")       // visualization type
        .y("x")         // key to use for y-axis
        .x("timestamp")          // key to use for x-axis
        .draw()             // finally, draw the visualization!
    }

我的csv：

timestamp,x,y,z
0,2019-02-28 12:20:19.631,1.072,-0.153,10.113
1,2019-02-28 12:20:19.731,1.072,-0.153,10.419
2,2019-02-28 12:20:19.831,1.072,-0.153,9.96
3,2019-02-28 12:20:19.931,1.072,-0.153,10.113
4,2019-02-28 12:20:20.031,1.072,-0.153,10.113
5,2019-02-28 12:20:20.132,1.225,-0.153,9.96
6,2019-02-28 12:20:20.231,1.225,-0.153,9.96
7,2019-02-28 12:20:20.331,1.225,-0.153,9.96
8,2019-02-28 12:20:20.431,0.919,-0.306,9.5
9,2019-02-28 12:20:20.531,0.919,0.459,9.807
10,2019-02-28 12:20:20.631,1.225,0.153,10.113
11,2019-02-28 12:20:20.731,1.379,-1.992,10.113
12,2019-02-28 12:20:20.831,1.838,-0.306,9.653
13,2019-02-28 12:20:20.931,0.153,0.766,10.113
14,2019-02-28 12:20:21.032,0.459,1.532,10.266
15,2019-02-28 12:20:21.133,1.072,0.0,9.96

我刚收到消息：没有可用数据

怎么了？我在互联网上找不到通过这个库加载 csv 的任何示例

或者知道如何通过一般 D3 从 csv 中通过简单示例绘制图表？

4

1 回答 1

0

d3plus 似乎正在使用 d3.js 的 v3.5.15。无论如何，您都需要告诉 d3plus 如何加载数据。阅读 API 文档，您似乎必须使用

d3plus.dataLoad(path, [formatter], [key], [callback])如此处所述。

或者，您可以使用 d3.js 解析您的 csv 文件并将其作为数据传递。为此，您可以使用

d3.csv.parse(string[, accessor])如d3.js CSV API中提供的那样。

请记住，在这两种情况下，您都需要将时间戳格式化为正确的时间格式（对于d3.js 时间格式 API 文档），以便您能够使用时间刻度。至少对于 d3.js，当从 CSV 解析数据时，所有值都是字符串值，因此您需要使用类型转换函数更改值的类型。您可以通过 Learnjsdata（ d3.js v3或 d3.js v5）阅读有关如何读取数据的精彩指南，了解更多相关信息

d3.js v3 有几个关于导入数据进行处理的示例，总体上可能是一个更好的选择。还要考虑 d3plus 在一年多的时间里没有得到 github 提交，因此该库可能没有得到很好的支持。

我希望这会有所帮助，至少让您有一个开始。如果您需要更多帮助，请在下方留言。

于 2019-04-14T21:24:30.587 回答