html - SVG 饼图 : How to draw irregular sized Pie Graphs

Question

我正在尝试创建一个 277 度的 SVG 饼图。 我有一些代码可以创建一个看起来正确的饼图，但我不确定我的代码是否首先正确(在正确的位置)以及我是否可以改进它。

左边是我试图重新创建的饼图，右边是我的代码输出:

我感觉我的尝试有一个中心点太靠右(两条线相交的地方)。这个圆应该是 277 度。我的代码是否正确？如果不正确，如何修复 - 我需要更改什么以及更改为什么值？

<svg width="400" height="400">
    <path d="M200,200 h-150,-20 a150,150 0 1,0 150,-150 z"
     fill="red" stroke="blue" stroke-width="5" />
</svg>

PS:是否可以只给 SVG 一个度值，因为只说“填充到 277 度”而不是对实际点等使用 trig 会容易得多。

Answer 1

路径正确(运行看结果)

<svg width="400" height="400" id='pie'>
    <path d="M200,200 L187,100 A100,100 1 1,1 100,200 z"
     fill="red" stroke="blue" stroke-width="2" />
</svg>