d3js 动态 csv 从下拉列表切换

【问题标题】：d3js dynamic csv switch from dropdown listd3js 动态 csv 从下拉列表切换
【发布时间】：2015-05-13 22:36:14
【问题描述】：

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

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

我一直在写php和java，而java被php回显，所以我认为我完全走错了路。

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

亲切的问候，

西尔万

【问题讨论】：

标签： java javascript csv d3.js

【解决方案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 是其标准参考。

【讨论】：

太棒了。现在我可以选择以图形方式显示的 CSV。非常感谢。我正在关闭线程。