Javascript 为什么这个长方形不宽

我有下面的代码，希望看到一个宽而薄的浅灰色矩形-为什么矩形不是700px宽

测试饼图
.点击但是{
字体系列：verdana；
字体大小：9px；
字体大小：粗体；
背景色：#ffa500！重要；
边界半径：100px；
形状渲染：边缘清晰；
}
#产品名称{
位置：绝对位置；
顶部：5px；
左：10px；
宽度：750px；
高度：35px；
}
.切片{
字号：12号；
字体系列：Verdana；
填充物：白色；
字体大小：粗体；
}
.线路{
填充：无；
笔画宽度：3px；
}
.头衔{
字体系列：Verdana；
字体大小：11px；
字体大小：粗体；
}
.yAxis文本，
.xAxis文本{
字体：7pt Verdana；
中风：无；
填充：黑色；
}
.轴--y路径，
.轴--x路径{
显示：无；
}
.轴--x线，
.轴--y线{
笔画：黑色；
填充：无；
笔画宽度：2px
}
.轴--y线{
笔画宽度：1px
}
.bar:悬停{
填充物：橙色；
}
.d3提示{
线高：1；
字体大小：10px；
填充：10px；
背景：rgba（0,0,0,0.7）；
颜色：#fff；
边界半径：2px；
}
.d3提示：之后{
框大小：边框框；
显示：内联；
字体大小：10px；
宽度：100%；
线高：1；
颜色：rgba（0,0,0,0.8）；
内容：“\25BC”；
位置：绝对位置；
文本对齐：居中；
}
第三点提示n：之后{
保证金：-1px0；
最高：100%；
左：0；
}
addprodtil（）；
// ###########################################
函数prodTitlBasics（）{
var保证金={
排名：2，
右:2,，
底部：2，
左：70
},
宽度=700，
高度=35；
返回{
保证金：保证金，
宽度：宽度，
高度：高度
};
}
函数addProdTitl（）{
var basics=prodTitlBasics（）；
var保证金=基本保证金，
宽度=700-边距。左侧-边距。右侧，
高度=基本高度；
控制台日志（宽度）
var t=d3。选择（“prodTitle”）
.append（“svg”）；
var x=t
.附加（“g”）
艾特先生({
“转换”：“转换（“+margin.left+”，“+height+”），
id:“svgGxxx”
});
x
.append（“rect”）
艾特先生({
“转换”：“翻译（5,5）”
})
艾特先生({
x:0，//margin.left，
y:0，//margin.top，
宽度：700，//宽度，
高度：5，//20，
填充：“浅灰色”
})
}

对于大多数浏览器，当您不设置SVG的宽度x高度时，它会自动设置为默认大小300 x 150

让我们检查一下。首先，我们附加SVG而不定义其宽度或高度：

var svg = d3.select("body").append("svg");

然后，让我们看看它的宽度/高度：

svg.node().getBoundingClientRect()

查看演示：

var svg=d3.select（“body”）.append（“svg”）；
log（“宽度为”+svg.node（）.getBoundingClientRect（）.width）；
log（“高度为”+svg.node（）.getBoundingClientRect（）.height）
对于大多数浏览器，当您不设置SVG的宽度x高度时，它会自动设置为默认大小300 x 150

让我们检查一下。首先，我们附加SVG而不定义其宽度或高度：

var svg = d3.select("body").append("svg");

然后，让我们看看它的宽度/高度：

svg.node().getBoundingClientRect()

查看演示：


var svg=d3.select（“body”）.append（“svg”）；
log（“宽度为”+svg.node（）.getBoundingClientRect（）.width）；
log（“高度为”+svg.node（）.getBoundingClientRect（）.height）
通过执行Inspect元素，我可以告诉您矩形是700px。然而，您的SVG只有300px，并且具有
overflow:hidden
@Santi是对的，如果将widt:100%添加到svg中，看起来不错。通过执行Inspect元素，我可以告诉您矩形是700px。然而，您的SVG只有300px，并且具有
overflow:hidden
@Santi是对的，如果您将widt:100%添加到svg中看起来很好。谢谢Gerardo-我记得Being告诉我svg的自动大小？这只是我可疑的记忆在捉弄我吗？谢谢Gerardo-我记得Being告诉我svg的自动大小？那只是我可疑的记忆在捉弄我吗？