Question

当转换到凹坑条形图中具有较少或不同条形的新数据时，被移除的条形图将在图表左侧相互顶部推动并保持整个过渡时间。

以下是重新创建效果的代码示例：

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/

（改编自约翰基尔南德答案的酒窝：Update dimple.js chart when select a new option）

有没有办法让被删除的酒吧退出过渡？

Answer 1

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

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

1 个答案: