如何使用d3小和弦的尺寸

Question

我是d3的新手，我正在尝试使用http://syntagmatic.github.io/parallel-coordinates/

在这里，您可以看到来自网站的极简的例子。

<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="d3.parcoords.js"></script>
<link rel="stylesheet" type="text/css" href="d3.parcoords.css">
<div id="example" class="parcoords" style="width:360px;height:150px"></div>

<script>
var data = [
  [0,-0,0,0,0,3 ],
  [1,-1,1,2,1,6 ],
  [2,-2,4,4,0.5,2],
  [3,-3,9,6,0.33,4],
  [4,-4,16,8,0.25,9]
];

var pc = d3.parcoords()("#example")
  .data(data)
  .render()
  .ticks(3)
  .createAxes();
</script>

我不想用#parcoords.dimensions(维度)显示和尝试不同的方法。你怎么解决这个问题？

Answer 1

我看了一下吉拉特的小提琴装置，但看上去并没有像我想的那样工作。在这个小提琴中，维度的名称已经被删除，但是维度之间的链接或行仍然代表原始数据。这种行为在我看来很奇怪，可能是个错误。

无论如何，我已经设置了一个小提琴，预先过滤数据使用：

data.forEach( function (e,j) { 
    var temp ={};
    filteredDimensions.forEach ( function (d,i) {
        temp[d] = e[d]
    })
    filteredData.push(temp)
})

用一把工作的小提琴这里

Answer 2

只需将您的.dimensions()调用添加到.ticks()之后和.createAxes()之前

var pc = d3.parcoords()("#example")
  .data(data)
  .render()
  .ticks(3)
  .dimensions([1,2,4])
  .render()
  .createAxes();

Jsfiddle 这里

在研究了user1614080的解决方案后，他只是提前过滤数据，这很容易，而且总是可用的，但不是您所要求的。我尝试使用他的示例(带有名称)，只使用维度的名称(jsFiddle 这里)。我的方式，它的工作与命名的尺寸也很好。

尺寸只需要在.render()之后的某个地方，但我不知道为什么。

编辑：终于弄明白了为什么这不正确。需要在更新维度之后调用.render() (稍微提到这里)。两个示例都更新以修复轴之间的拐点。