使用D3.js动态更新treemap元素 [英] Dynamically update treemap elements with D3.js

问题描述

我正在尝试使用D3.js和以下示例实现树形图：
http://mbostock.github.com/d3/ex/treemap.html

I'm experimenting with implementing a treemap using D3.js and the following example: http://mbostock.github.com/d3/ex/treemap.html

到目前为止，它的效果还不错。

So far it works pretty good.

我的问题是，如果我想使用转换刷新树形图项目一个全新的数据集，我不能这样做。

My problem is if I would like to refresh the treemap items using transition for a completely new set of data, I cannot do it. I can only do this if I reinitialize the treemap object.

让我们举一个简单的例子：

Let's take a simple example:

DATASET1： PROD1，PROD2，PROD3 ...
DATASET2：LOC1，LOC2，LOC3，LOC4 ...

DATASET1: PROD1, PROD2, PROD3... DATASET2: LOC1, LOC2, LOC3, LOC4...

我想要一个过渡动画这两个数据集具有不同数量的元素和不同的大小（值）。再次，我只能通过基本上删除父DIV id（$（＃treemap_1）。empty（）;）的元素，然后使用新的数据集重新创建整个树形图。

I would like to have a transition animation when switching between the two datasets, which have different number of elements and different sizes (values). Again, I could only do it by basically removing the elements of the parent DIV id ($("#treemap_1").empty();) and then recreate the whole treemap with the new dataset.

对不起，我是D3.js的新手，所以也许这很明显。 ：）

Sorry, I'm very new to D3.js, so maybe it's something obvious. :)

谢谢&最好的问候，
Bence

Thanks & best regards, Bence

推荐答案

它可以与我的问题。

问题是树形图是 sticky 。

这篇关于使用D3.js动态更新treemap元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！