d3js 动态 csv 从下拉列表切换

Question

我是 d3js 的新手，我在这里成功地使用了示例：https://gist.github.com/d3noob/4414436

这很好，因为它可以远程工作，CSV 存储在服务器端。现在，我想更进一步，添加 select 列表中的源 CSV 和重绘图表的功能。

我一直在写 php 和 java，java 被 php 呼应，所以我认为我完全错了方式。

您能否提供一个示例来说明如何执行图表更新并从包含服务器端 CSV 路径的下拉列表中读取新的 CSV select？

亲切的问候，

西尔万

Answer 1

我假设您不需要帮助来制作下拉列表。最简单的方法是将下拉列表选择输入 var，然后在调用 d3.csv() 时使用 var。例如：

//storing the drop-down selection in the ddSelection var
var ddSelection = document.getElementById("secondOption").value,

//feeding that to create the csv filename you want
var csvFile = "/some server path/" + ddSelection + ".csv";

d3.csv(csvFile, function(error, dataset) {
    //a bunch of cool visualizing stuff
})

然后您只需要记住在加入数据时包含 .exit()，以便图表随新数据集一起更新 - Mike Bostock 的 Thinking with Joins 是标准参考那。

d3js 动态 csv 从下拉列表切换

d3js dynamic csv switch from dropdown list

javascript

java

csv

d3.js