Question

我用d3.js构建了一些SVG，但没有显示任何内容。为什么？以下是代码的一部分：

<svg width="863" height="863" id="svgId">
<g transform="translate(431.5,431.5)">
    <g class="asdf" r="421.5">
        <circle transform="translate(0,0)" style="fill: rgb(255, 0, 0);"></circle>
    </g>
    <g class="asdf" r="127.6354829132969">
        <circle transform="translate(-118.50486492278469,167.13470131539657)" style="fill: rgb(255, 0, 0);"></circle>
    </g>
</g>

Answer 1

您已在<g>元素上设置了半径（r属性），它不执行任何操作，而不是<circle>元素所在的位置。你需要的是......

<svg width="863" height="863" id="svgId">
<g transform="translate(431.5,431.5)">
    <g class="asdf">
        <circle r="421.5" transform="translate(0,0)" style="fill: rgb(255, 0, 0);"></circle>
    </g>
    <g class="asdf">
        <circle  r="127.6354829132969" transform="translate(-118.50486492278469,167.13470131539657)" style="fill: rgb(255, 0, 0);"></circle>
    </g>
</g>
</svg>

为什么圈子不显示？

1 个答案: