我在代码中使用了两个 svgs。一种是使用 HTML,另一种是使用 d3:
<svg>
<circle cx="40" cy="40" r="24" style="stroke:#006600; fill:#00cc00"/>
</svg>
var svg = d3.select("body")
.append("xhtml:div")
.append("svg")
.attr("width",500)
.attr("height",50)
.attr("fill","yellow")
.attr("stroke","orange")
;
第一个显示,第二个不显示。
最佳答案
这是你的实际代码吗? d3
是 JavaScript,如果要将其嵌入 HTML 中,则需要脚本标记。此外,SVG
元素没有填充或描边属性。您应该像任何使用 CSS 的传统 html 元素一样设置它的样式。
<script src="//d3js.org/d3.v4.js"></script>
<svg>
<circle cx="40" cy="40" r="24" style="stroke:#006600; fill:#00cc00" />
</svg>
<script>
var svg = d3.select("body")
.append("xhtml:div")
.append("svg")
.attr("width", 500)
.attr("height", 50)
.style("background-color", "yellow")
.style("border", "2px solid orange");
</script>
关于javascript - d3js svg 在 chrome 中不可见,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39817957/