Html SVG查找应用了旋转和笔划的圆的CY、CX

这是我在这里的第一个问题，如果格式不正确，我深表歉意。我正在玩使用SVG和CSS动画的径向进度条。但是，我很难确定半径和CY，CX值。我的SVG的总宽度是140px，所以我想我的半径是70px，但我有一个14px的笔划，所以它会是63px吗？另外，使用rotate时，我注意到还有CY，CX，它定义了圆的中心点。我猜这和我的半径一样

这里有一把小提琴来举例说明。你会发现这个圆并不能精确地放入容器中。我做错了什么？这些值是如何计算的

<svg width="140" height="140">
    <circle class="outer" cx="70" cy="70" r="63" transform="rotate(-90, 70, 70)"/>
</svg>

我的小提琴：

---

谢谢！：）

我想我解决了这个问题。FF错误修复似乎导致了问题，但我的cx、cy和r似乎是正确的

-moz-transform: rotate(-89deg) translateX(-140px);

---

我不知道在宽度/高度上使用viewBox是否有好处？

我想我已经解决了这个问题。FF错误修复似乎导致了问题，但我的cx、cy和r似乎是正确的

-moz-transform: rotate(-89deg) translateX(-140px);

---

我不知道在宽度/高度上使用viewBox是否有好处？

当我删除moz转换时，我看不出有什么问题，所以我不确定你的意思。这是一篇文章中建议的，但它可能已经被弃用了。当我删除moz转换时，我看不出有什么问题，所以我不确定你说的FF bug是什么意思。这是一篇文章中建议的，但它可能已经被弃用了。