选择JavaScript drowndown选项会导致D3树图更改

Question

我有一个D3树形图，并希望在单独的<div>标记中使用javascript包含下拉列表。由于某种原因，选择了一个选项后，D3树形图会发生变化。

我一直绞尽脑汁试图弄明白，但没有运气。

我把它放在一个小提琴http://jsfiddle.net/2jar30c2/1/

中

Answer 1

树形图的变化是由于这一行：

treemap.value(this.value == "size" ? size : count).nodes(root);

this.value等于Option 1或Option 2所以此行设置值访问者计数函数：

function count(d) {
    return 1;
}

treemap中tile的大小取决于此值。之前将此函数设置为值访问器：

function(d) {
    return d.size;
}

它返回在JSON中定义的size属性，它包含与count accessor返回的值不同的值（count为每个节点返回1）。