css - 为什么svg是:text just not displaying?

标签 css svg d3.js

我肯定遗漏了一些明显的东西,但我无法获得 <text>现身。参见 http://jsfiddle.net/ydaLh/用于 HTML + CSS

<svg style="width: 320px; height: 200px; top: 0px; left: 0px; position: relative;">
    <g class="depth">
        <g class="children">
            <rect class="child" x="99" y="0" width="47" height="30">
                <text dy=".75em" x="105" y="6">PRIMARY</text>
            </rect>
            <rect class="child" x="90" y="0" width="8" height="30">
                <text dy=".75em" x="96" y="6">MASTER</text>
            </rect>
            <rect class="parent" x="90" y="0" width="56" height="30"></rect>
        </g>
    </g>
</svg>

基于 http://bost.ocks.org/mike/treemap/

最佳答案

在 SVG 中,你不会在图形元素中嵌套文本元素,你必须有类似的东西:

svg
  .append("rect")
  .append("text");

但你实际上需要:

svg.append("rect"); 
svg.append("text"); 

关于css - 为什么svg是:text just not displaying?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14970504/

相关文章:

html - 如何扩展我的 CSS3 菜单并减小其宽度

html - 图像(字面意思)远离 div

javascript - 工具提示未显示 d3.js

javascript - 同一页面上有 2 个 Google 图表的渲染问题

image - SVG 图像的自动宽度和高度

css - 设置位置固定

css - MVC 3 : Can't Load Partial View without Inheriting CSS from Master Page (Telerik Report Viewer + Bootstrap)

jquery - 将鼠标悬停在同一位置的两个元素上

javascript - D3 缩放不起作用

javascript - D3 Angular-cli : d3. getElementsByTagName 不是函数