SVG Arc不会转到Circle的边缘

Question

我正在手工制作一个SVG来显示一个有n个段的圆圈，其中m个被填充。

在我的第一个简单的测试案例中，我设置n = 4和m = 1.我绘制一个圆，然后4个路径显示圆的4个象限之间的划分，并且我有一个填充其中一个的路径使用弧命令的颜色象限。但是，弧的填充部分并未完全到达圆的边缘。

这是我的SVG：

<svg width="150" height="150" version="1.1" xmlns="http://www.w3.org/2000/svg">
    <path d="M 75 10 A 75 75 0 0 1 140 75 L 75 75 Z" fill="green" stroke="none"/>
    <circle cx="75" cy="75" r="65" stroke="black" fill="transparent" stroke-width="1"/>
    <path d="M75,10 L75,75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M140,75 L75,75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M75,140 L75,75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M10,75 L75,75" fill="none" stroke="black" stroke-width="1"/>
</svg>

当我渲染一个n = 3的SVG时，我遇到了同样的问题。事实上，差距更加明显：

<svg width="150" height="150" version="1.1" xmlns="http://www.w3.org/2000/svg">
    <path d="M 75 10 A 75 75 0 0 1 131.29165 107.5 L 75 75 Z" fill="green" stroke="none"/>
    <circle cx="75" cy="75" r="65" stroke="black" fill="transparent" stroke-width="1"/>
    <path d="M 75 10 L 75 75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M 131.29165 107.5 L75,75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M 18.70834 107.5 L75,75" fill="none" stroke="black" stroke-width="1"/>
</svg>

我记得读过弧确实有一些限制，特别是当涉及到代表完整圆的弧时，因为确切的路径是未定义的。然而，我并没有意识到这意味着相对于他们所描绘的圆圈，越来越长的弧变得越来越窄。我的SVG出了什么问题吗？为什么我的弧线不能完全填满＆＃34; wedge＆＃34;圈子？

Answer 1

我认为你的半径设置错误为75而不是65：

<svg width="150" height="150" version="1.1" xmlns="http://www.w3.org/2000/svg">
    <path d="M 75 10 A 65 65 0 0 1 140 75 L 75 75 Z" fill="green" stroke="none"/>
    <circle cx="75" cy="75" r="65" stroke="black" fill="transparent" stroke-width="1"/>
    <path d="M75,10 L75,75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M140,75 L75,75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M75,140 L75,75" fill="none" stroke="black" stroke-width="1"/>
    <path d="M10,75 L75,75" fill="none" stroke="black" stroke-width="1"/>
</svg>