使用javascript添加到DOM的SVG是不可见的。
使用javascript添加到DOM的SVG是不可见的。
提问于 2014-03-21 11:34:36
我有一个有效的SVG文件，我通过在图像查看器中打开它来验证它。
我尝试使用javascript代码将这个SVG添加到HTML文件中
d3.xml("assets/abc.svg", function(xml) {
document.body.appendChild(xml.documentElement);
});我检查HTML源代码，可以看到SVG是添加到HTML中的。但是SVG在页面上不可见。知道原因是什么吗？
注意：
- D3工作很好。
- SVG是有效的。
- SVG将被添加到体内的DOM结构中。
- 它在chrome和firefox中都不可见。
回答 2
Stack Overflow用户
回答已采纳
发布于 2014-03-21 16:41:35
在IE/FF/CH中对我来说很好。我有有效的svg，在我的根svg中有以下内容：
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
...>如果您有那个名称空间，那么问题很可能是svg格式不正确。或者，svg本身是不可见的，即display=“无”或viewBox很小。
Stack Overflow用户
发布于 2014-03-21 22:46:33
如果您的HTML是正确的，打开Chrome工具上的“元素”面板，检查svg的“display”(块)、“高度”、“宽度”、“可见性”(可见)和“不透明度”(> 0)属性。如果渲染引擎(可见或非可见的)确实显示了什么内容，则chrome将在页面中勾画它，同时在“元素”中悬停在DOM节点上。还要检查是否有任何东西可以屏蔽/覆盖SVG节点。
此外，您还可以尝试在svg节点上设置“填充”或“笔画”颜色。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22557669
复制相关文章
相似问题
腾讯云开发者
