是否可以将D3脚本作为函数调用?特别是传递数据选择器?
我有一个简单的圆环图,我用它来显示一个月的数据。我希望能够回忆起相同的D3图形,并根据onClick
事件为一年中的每个月传递不同的数据。因此,图表将在同一空间重绘。
我已经看到其他图表radio selection由onchange
触发,再次运行D3脚本的一部分来重绘图形。但是,我不能将我的D3脚本设置为函数,并且只要我想显示不同的数据就调用它吗?
我还看到chart here使用(window.d3)
调用D3函数,但似乎(function(d3){...}
的函数定义不允许传递任何变量。或许我也不能确切地理解这是如何执行的。
根据svg外的点击完成反应图表的最简单方法是什么?
答案 0 :(得分:1)
我做了一个类似的工作,我有链接,我可以选择其中一个链接来选择适用于情节的JSON。以下是感兴趣的HTML片段 -
<ul class="dropdown-menu" role="menu">
<li><a class="m" value="2014-02-19" href="#">2014-02-19</a></li>
<li><a class="m" value="2014-02-20" href="#">2014-02-20</a></li>
<li><a class="m" value="2014-02-21" href="#">2014-02-21</a></li>
<li><a class="m" value="2014-02-22" href="#">2014-02-22</a></li>
<li><a class="m" value="2014-02-23" href="#">2014-02-23</a></li>
</ul>
...
这是进行选择的Javascript代码段 -
//On click, update with new data
d3.selectAll(".m")
.on("click", function() {
var date = this.getAttribute("value");
var str;
if(date == "2014-02-19"){
str = "19.json";
}else if(date == "2014-02-20"){
str = "20.json";
}else if(date == "2014-02-21"){
str = "21.json";
}else if(date == "2014-02-22"){
str = "22.json";
}else{
str = "23.json";
}
d3.json(str,function(json){
dataset = json;
stack(dataset);
...
希望这有帮助。