Question

我用下面的例子 http://alignedleft.com/tutorials/d3/binding-data/ 从d3js开始。但是我无法使此代码正常工作

   <script>
    var dataset = [ 5, 10, 15, 20, 25 ];
    var dataset2 = [ 5, 10, 15, 20, 25 ];
    d3.select("body").selectAll("p")
    .data(dataset)
    .enter()
    .append("p")
    .text("New paragraph!");

    d3.select("body").selectAll("p")
    .data(dataset2)
    .enter()
    .append("p")
    .text("New paragraph23!");
    </script>

它仍然只显示一组数据。

Answer 1

您必须按类别分隔数据集。

var dataset = [ 5, 10, 15, 20, 25 ];
var dataset2 = [ 5, 10, 15, 20, 25 ];
d3.select("body").selectAll(".set1")
.data(dataset)
.enter()
.append("p")
.attr("class", "set1")
.text("New paragraph!");

d3.select("body").selectAll(".set2")
.data(dataset2)
.enter()
.append("p")
.attr("class", "set2")
.text("New paragraph23!");

<script src='https://d3js.org/d3.v5.js' type='text/javascript'></script>

d3js正确使用selectAll和dataSet

1 个答案: