我正在使用酒窝js,我想设置一个事件,当用户单击图表上的plot(circle)时,图表的值已更新,但是当我为此设置事件处理程序时,这是问题 它只工作了一次,如果用户第二次单击什么也没发生,这里有什么问题,我应该怎么做才能解决这个问题这是我的js代码
data = [
{ "Value" : 10, "Year" : 2009},
{ "Value" : 11, "Year" : 2011},
{ "Value" : 12, "Year" : 2007},
{ "Value" : 13, "Year" : 2006},
{ "Value" : 14, "Year" : 2014},
{ "Value" : 15, "Year" : 2012},
{ "Value" : 16, "Year" : 2011},
{ "Value" : 17, "Year" : 2013},
{ "Value" : 18, "Year" : 2015}
];
var svg = dimple.newSvg(#chartContainer", 600, 400);
var chart = new dimple.chart(svg, data);
var x = chart.addCategoryAxis("x", "Year");
x.addOrderRule("Year");
var y = chart.addMeasureAxis("y", "Value");
chart.addColorAxis(Value", ["green", "yellow", "red"]);
var lines = chart.addSeries(null, dimple.plot.line);
lines.lineWeight = 4;
lines.lineMarkers = true;
chart.ease = "bounce";
chart.staggerDraw = true;
chart.draw(1000);
这是事件代码
d3.selectAll("circle").on("click", function (e) {
chart.data = [
{ "Value" : (Math.random() * 100), "Year" : 2009},
{ "Value" : (Math.random() * 100), "Year" : 2011},
{ "Value" : (Math.random() * 100), "Year" : 2007},
{ "Value" : (Math.random() * 100), "Year" : 2006},
{ "Value" : (Math.random() * 100), "Year" : 2014},
{ "Value" : (Math.random() * 100), "Year" : 2012},
{ "Value" : (Math.random() * 100), "Year" : 2011},
{ "Value" : (Math.random() * 100), "Year" : 2013},
{ "Value" : (Math.random() * 100), "Year" : 2015}
];
chart.draw(1000);
});
这对
我有用。
小提琴链接
d3.selectAll("circle").on("click", function (e) {
chart.data = [
{ "Value" : (Math.random() * 100), "Year" : 2009},
{ "Value" : (Math.random() * 100), "Year" : 2011},
{ "Value" : (Math.random() * 100), "Year" : 2007},
{ "Value" : (Math.random() * 100), "Year" : 2006},
{ "Value" : (Math.random() * 100), "Year" : 2014},
{ "Value" : (Math.random() * 100), "Year" : 2012},
{ "Value" : (Math.random() * 100), "Year" : 2011},
{ "Value" : (Math.random() * 100), "Year" : 2013},
{ "Value" : (Math.random() * 100), "Year" : 2015}
];
chart.draw(1000);
});