javascript - D3 可视化 - 如何自动选择按钮

Question

我是 D3(和 javascript)新手，但已根据我的目的调整了此可视化效果:

D3 visualization

The code

如何自动单击按钮，以便浏览器无限循环地转到每个按钮？

我尝试将 jQuery 与 $("#button_id").click(); 结合使用，但没有执行任何操作。

Answer 1

由于该函数是使用按钮的 ID 调用的...

myBubbleChart.switchMode(buttonId);

这里的任务相对简单。

首先，设置一个包含所有 ID 的数组:

var ids = ["all", "region", "Change", "change_vs_net_value", "assets_on_map"];

然后，循环调用 myBubbleChart.switchMode() 函数。这是一种非常简单的方法，使用 d3.timeout 每 3 秒调用该函数(并更改按钮外观):

var index = 0;
d3.interval(function() {
    myBubbleChart.switchMode(ids[(index++) % 5])
    d3.selectAll(".button").classed("active", function(_, i) {
        return i === index % 5 - 1;
    })
}, 3000)

这是 bl.ocks 的演示:http://blockbuilder.org/GerardoFurtado/dfaaedf591b980c2864eb054c7b29300