javascript - D3 : Select SVG attribute and change it

Question

如果我有一个 SVG...

var canvasBars = d3.select("#chart1").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)    
.append("g")
.attr("transform", "translate("+margin.left+","+margin.top+")");

如果我修改了宽度变量(用于计算宽度属性)，我该如何选择宽度属性并使用这个新的宽度变量对其进行修改？

这似乎不起作用:

canvasBars.attr("width", width + margin.left + margin.right);

Answer 1

您的另一个选择是确保之前的“canvasBars”变量实际上是 Canvas 。

var svgSelection = d3.select("#chart1").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)

var baseGroup = svgSelection.append("g")
.attr("transform", "translate("+margin.left+","+margin.top+")");

我已将您以前的“canvasBars”重命名为“svgSelection”。如果你想直接修改“ Canvas ”，你以前的想法现在就可以了。

svgSelection.attr("width", width + margin.left + margin.right);