gpt4 book ai didi

javascript - Dimple.js 条形图转换包括删除的条形图

转载 作者:塔克拉玛干 更新时间:2023-11-02 22:47:29 24 4
gpt4 key购买 nike

当过渡到凹坑条形图中具有较少或不同条形的新数据时,被移除的条形会被推到图表左侧并在整个过渡时间内保持不变。

下面是重现效果的代码示例:

var svg = dimple.newSvg("#chartContainer", 590, 400);
var data = [
{ Animal: "Cats", Value: (Math.random() * 1000000) },
{ Animal: "Dogs", Value: (Math.random() * 1000000) },
{ Animal: "Mice", Value: (Math.random() * 1000000) },
{ Animal: "Rat", Value: (Math.random() * 1000000) },
{ Animal: "Cow", Value: (Math.random() * 1000000) }
];
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 510, 305)
var x = myChart.addCategoryAxis("x", "Animal");
x.addOrderRule(["Cats", "Dogs", "Mice"]);
myChart.addMeasureAxis("y", "Value");
myChart.addSeries(null, dimple.plot.bar);
myChart.draw();

d3.select("#btn").on("click", function() {
myChart.data = [
{ Animal: "Cats", Value: (Math.random() * 1000000) },
{ Animal: "Dogs", Value: (Math.random() * 1000000) },
{ Animal: "Mice", Value: (Math.random() * 1000000) }
];
myChart.draw(1000);
});

如果您单击示例中的按钮,您将看到效果。示例:http://jsfiddle.net/nf57j/25/

(酒窝改编自 John Kiernander 在这里的回答:Update dimple.js chart when select a new option)

有没有办法让移除的栏不在过渡中?

最佳答案

我已经重写了将于周一发布的 Dimple v2.0 的所有转换代码。我刚刚在版本 2 中尝试了这个示例,它看起来好多了。

关于javascript - Dimple.js 条形图转换包括删除的条形图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23305527/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com