尝试在 SVG 中生成饼图。在 Chrome 中工作正常,但在 Firefox 中不起作用。有任何想法吗?切片占馅饼的 35%。添加了 PI 来计算切片。我想我已经做对了一切。在 Mac 和 Windows 中尝试了最新的 Firefox。结果一样。切片不显示。必须添加 calc() 才能做正确的数学运算。
<svg height="20" width="20" viewBox="0 0 20 20" style="width: 500px; height: auto;">
<circle r="10" cx="10" cy="10" fill="#F2FBFF" />
<circle r="5" cx="10" cy="10" fill="transparent" stroke="#21BAFF" stroke-width="10" stroke-dasharray="calc(35 * 31.42 / 100) 31.42" transform="rotate(-90) translate(-20)" />
</svg>Run Code Online (Sandbox Code Playgroud)