如何使用svg路径基于焦点坐标绘制椭圆？

Question

我有一个椭圆焦点的坐标。 从一个焦点到椭圆边界到第二焦点的距离等于轴之间总距离的130％。 http://www.w3schools.com/svg/svg_path.asp 如何使用svg基于这些坐标绘制椭圆？或者任何非水平椭圆。不幸的是，在这种情况下我不能使用svg Ellipse。

以下两个椭圆弧形成一个椭圆，但我不知道如何根据焦点操纵它们。

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
     <path d="M 125,75 a180,50 100 1,1 100,50" />
     <path d="M 125,75 a180,50 100 0,0 100,50" />
</svg>

Answer 1

两个焦点本身没有定义椭圆，你需要一个更真实的参数。这可以从以下事实看出：人们可以通过在焦点周围包裹固定长度的字符串来绘制椭圆，并使其与绘图笔保持嘲讽。这是你错过的字符串长度。所以你需要例如椭圆上的一个点，或类似的东西。

给定一个参数以及焦点之间的距离，您可以compute所有其他参数，例如半长轴和半长轴的长度，因为您需要它们用于路径规范。因此，例如，如果你有一个点应该位于椭圆上，那么你可以计算到两个焦点的距离，添加这些长度，并知道该总和等于2 a ，其中 a 是半长轴的长度。然后你得到半轴的长度为 b = sqrt（ a ² - f ² ），其中2 f 是你的焦点之间的距离。

现在你已经在你的问题中包含了130％的部分，我也可以给你一个计算。
你有 a = 1.3 f 。由此得到 b = sqrt（1.3 ² -1） f ≈0.83。请注意， f 仍然指的是 half 焦点之间的距离。您还需要在椭圆上计算两个点。在主轴上选择这些是最简单的。所以如果 F 和 G 是你的焦点，那么你有 P =（ f - a ）/（2 ）× F +（ f + a ）/（2 < i> f ）× G 作为椭圆上的一个点，并且 Q =（ f + a ）/（2 f ）× F +（ f - a ）/（2 f ）× G 作为另一个。

一旦获得了半长轴和半长轴的长度，就可以将它们用作svg路径的arc command的半径参数，这是前两个参数，在您的示例中为180,50 。您可以使用atan2或类似方法从连接焦点的线的斜率计算旋转，并将其用作第三个参数而不是100。以任何你喜欢的方式设置大弧标志（例如0），并且扫描标志任意但对于椭圆的两半（例如0）是相等的。所有这些术语都是指SVG 1.1规范中的description。移动到 P ，用我刚才描述的参数做一个弧指向 Q ，另一个回到 P 。

结果应该是与参数匹配的完整椭圆。 两个弧的组合在稍后的编辑中写入。