javascript - 使用 D3js 并行集动态添加或删除尺寸

Question

我正在尝试动态更改并行集图表的尺寸，如之前在 question 中所要求的那样.

我正在使用 Jason Davies 创建的可重复使用的图表: http://www.jasondavies.com/parallel-sets/

我使用以下代码创建图表:

var chart = d3.parsets()
      .dimensions(["Survived", "Sex", "Age", "Class"]);

var vis = d3.select("#vis").append("svg")
    .attr("width", chart.width())
    .attr("height", chart.height());

d3.csv("titanic.csv", function(error, csv) {
  vis.datum(csv).call(chart);
});

我创建了一个按钮，单击该按钮时应调用一个函数change，该函数应将尺寸更改为[“Survived”，“Sex”，“Class”]。

功能:

function change() {
    vis.call(chart.dimensions(["Survived", "Sex", "Class"]));
}

调用该函数时，我在第 90 行收到错误 Uncaught TypeError: Cannot read property 'hasOwnProperty' of undefined，该错误位于可重用图表中的 updateDimensions 函数内.

任何人对此都有解决方案，或者我应该通过使用解决方法来解决它，方法是创建一个具有新尺寸的新 svg 对象并删除旧的，如 user1386906 在之前询问的评论中提到的问题？

Answer 1

有没有办法让并行集采用数据实体的 json 中的不同值 我用一些随机数生成器做了

 svg.datum(data)
      .call(chart
        .value(function(d, i) {
            var v1, v2, v3;
            v1 = d["Valu"];
            v2 = d["Val"];enter code here
            v3 = d["Value"];
            console.log(v1);
            console.log(v2);
            console.log(v3);
            var x = Math.floor((Math.random() * 10) + 1);
            if (x < 5) {
                return v2;
            } else {
                return v3;
            }

        })
        .mapLevel(levelMap)
        .dimensions(arrayOfDimensions)
        //dimensions to be displayed by chart. (i.e "Cost Item", "Location" etc)
    );

有三个不同的值，分别命名为 Value、val、value ，我希望并行节点的节点取不同的值，使得每组并行节点具有不同大小的节点 示例:

nodeP        node Parallel to nodeP
]             ]
]

具有不同的大小，因此连接它们的功能带从源节点到目标节点具有不同的大小。