javascript - 计算约。 SVG 椭圆长度？ (用 Javascript 计算近似椭圆周长)

Question

我有一个像这样的 SVG 元素:

<ellipse class="solidLine" cx="649.9" cy="341.09" rx="39.49" ry="8.41"/>

我需要找到它的长度，这样我就可以为它的dashoffset设置动画，让它被“绘制”。

我已经使用以下标签完成了这些计算:line polyline circle path，但现在我需要计算椭圆的长度，我有点……卡住了。我进行了一些谷歌搜索，但似乎无法找到计算椭圆周长的 Javascript 方法。

有什么帮助吗？到目前为止，这是我的函数格式:

const getEllipseLength = (ellipse) => {
    let rx = ellipse.getAttribute('rx');
    let ry = ellipse.getAttribute('ry');
    let totalLength = //function to calculate ellipse circumference using radius-x (rx) and radius-y (ry) here!
    return totalLength;
};

谢谢!

编辑:如果有一种不是 100% 准确(但接近)的快速方法来执行此操作，那也很好。我只需要进入实际圆周的范围内即可制作流畅的动画。

编辑 2: 我认为使用 this equation 将给我一个接近的估计，而不必深入研究 Euler 的系列恶作剧。将其翻译成 Javascript 并查看它是否有效。

Answer 1

好吧，这实际上比我想象的要容易......好吧。

因为我只需要一个大概的长度，所以我翻译了this将等式转化为 Javascript 并得出以下结果:

const getEllipseLength = (ellipse) => {
    let rx = parseInt(ellipse.getAttribute('rx'));
    let ry = parseInt(ellipse.getAttribute('ry'));
    let h = Math.pow((rx-ry), 2) / Math.pow((rx+ry), 2);
    let totalLength = (Math.PI * ( rx + ry )) * (1 + ( (3 * h) / ( 10 + Math.sqrt( 4 - (3 * h) )) ));
    return totalLength;
};

当与 rx="39.49" 和 ry="8.41" 一起使用时，它给了我 164.20811705227723 的值，谷歌告诉我实际周长约为 166.79。还不错，适合 SVG 动画。