Question

我正在接触D3.js.我想写一个函数，用一组数据绘制一组点，然后用另一组数据绘制另一组点。

我写过这个，但第二组点覆盖了第一组点！如何在没有selectAll的情况下重写它，以便我正确地得到两组点？

function drawDots(mydata) { 
  focus.selectAll(".dot").data(mydata)
    .enter().append("circle")
    .attr("class", "dot")
    .attr("cx", line.x())
    .attr("cy", line.y())
    .attr("r", 3.5);
}
drawDots(data[0]);
drawDots(data[1]);

（注意：这是一种简化。基本上我想知道如何在函数调用中使用.enter()。）

Answer 1

您需要提供两组数据不同的类名。现在两者都被标记为相同的类（“。dot”），但如果它们代表不同的集合，您还需要能够区分它们。 E.g：

function drawDots(mydata, name) { 
  focus.selectAll(".dot"+"."+name).data(mydata)
    .enter().append("circle")
    .attr("class", "dot" + " " + name)
    .attr("cx", line.x())
    .attr("cy", line.y())
    .attr("r", 3.5);
}
drawDots(data[0], "set1");
drawDots(data[1], "set2");

Answer 2

我只使用d3js来构建力图，但我认为在你的情况下你需要先将节点添加到可视化中，然后调用enter（）然后获取图中的内容。

function drawDots(mydata) 
{ 
  myD3Object.nodes(myData).start();
  focus.selectAll(".dot").data(myD3Object.nodes())
  .enter().append("circle")
  .attr("class", "dot")
  .attr("cx", line.x())
  .attr("cy", line.y())
  .attr("r", 3.5);
}

基本D3.js：如何在函数中使用连接？

2 个答案: