Javascript 在同一页面上实现多个D3布局

我尝试在同一页面上添加多个D3图形，即饼图、条形图和使用CSV或JSON格式的不同数据的树布局。但我无法在同一页上实现所有这3个图形。当我在同一页上链接多个版面时，我得到一个空白页

我尝试使用以下HTML和JS将每个图表附加到不同的div中

HTML

<div id="piediv"></div>
<div id="bardiv"></div>
<div id="treediv"></div>

---

上面所有的JS行都在各自的JS文件中，即。pie.js、bar.js和tree.js首先，我建议您使用不同的名称声明svg变量

我用一个类似的问题为你做了一把小提琴；更详细地说，我在同一页中以这种方式创建了两个甜甜圈图表：

我用两个不同的ID创建了两个不同的

<div id="chart"></div>
<div id="chart2"></div>

有关更多详细信息，请查看

---

让我知道。

您只是过度编写了svg变量twice@thatOneGuy尽管这可能会破坏其他一些代码，但它不应该像OP@EricCartmann报告的那样导致空白页。请设置一个演示此效果的页面。

<div id="chart"></div>
<div id="chart2"></div>

var svg = d3.select("#chart").append("svg")
    .attr("width", width)
    .attr("height", height)
    .append("g")
    .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

var svg2 = d3.select("#chart2").append("svg")
   .attr("width", width)
   .attr("height", height)
   .append("g")
   .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");