Math 如何使用SVG绘制一个围绕焦点而不是中心的椭圆？

我正在用SVG绘制一颗恒星的行星轨道，我需要画一个基于一个焦点的椭圆，而不是几何中心。我在2d中绘制，但是位置需要考虑椭圆围绕焦点的旋转，以及Z轴的倾斜

我已经有沿着轨道运行的行星了，但我不能画出下面的椭圆，这样它们就匹配了。我有所有的轨道数据，包括所有的旋转参数，半长轴和半短轴。我知道我有我需要的所有数据，但我似乎不知道如何把它们组合起来。请帮忙

这是轨道分量图：

轨道数据示例 我需要焦点在0，0。通过计算半短轴（ry=0.387098*sqrt（1-0.205630^2）），我可以使椭圆的形状正确，如下所示：

<ellipse cx="0" cy="0" rx="0.387098" ry="0.378826" />

<ellipse cx="0.079597" cy="0" rx="0.387098" ry="0.378826" transform="rotate(<angle> 0 0)"/>

我还可以通过计算中心和焦点之间的距离（cx=sqrt（0.387098^2-0.378826^2））将焦点居中于0,0，因此我有：

<ellipse cx="0.079597" cy="0" rx="0.387098" ry="0.378826" />

我不知道如何围绕点0,0旋转椭圆。我可以使用上升节点的经度围绕几何中心顺时针旋转，但我还需要在Z方向上旋转椭圆，同时倾斜，这将影响rx和ry值。我也认为近日点的论点可能也适用于这里，但我不确定在哪里

我知道这些值小于一，但一旦我搞清楚了这个过程，我将使用乘数放大所有值

---

更新： 多亏了BigBadaboom，我现在可以围绕焦点旋转椭圆了。我仍然需要弄清楚如何在3d中旋转它。据我所知，以下是步骤：

将焦点转换为0,0-完成

通过近日点（29.124度）完成的参数沿z轴旋转（2d旋转）（感谢BigBadaboom）

沿y轴旋转（3d旋转）倾角（7.005deg）-？

再次沿z轴旋转上升节点的经度（48.331度）-过程与步骤2相同

---

所有旋转都以0,0为中心。

我不确定我是否完全理解您要做的所有事情。但是可以像这样执行0,0左右的旋转：

<ellipse cx="0" cy="0" rx="0.387098" ry="0.378826" />

<ellipse cx="0.079597" cy="0" rx="0.387098" ry="0.378826" transform="rotate(<angle> 0 0)"/>

---

我不确定自己是否完全理解您的意图。但是可以像这样执行0,0左右的旋转：

<ellipse cx="0" cy="0" rx="0.387098" ry="0.378826" />

<ellipse cx="0.079597" cy="0" rx="0.387098" ry="0.378826" transform="rotate(<angle> 0 0)"/>

---

这可能来得有点晚，但我自己也在努力解决同样的问题，并在试图找到一些解决方案时遇到了这个问题

我认为SVG不支持3D旋转，但可以使用CSS3变换

是我用CSS转换制作的SVG示例

对于不带CSS浏览器前缀（-webkit，-moz等）的更干净的SVG。在这个版本中，至少Chrome无法渲染3D变换，SVG中的轨道可能看起来有点像步骤3之前的版本

您可以将url参数用于SVG文件的其他变体：

• 大小：数字–>SVG的大小（以像素为单位）
• bbox:number–>以AU为单位的边界框的大小（1-200）
• noPrefixes–>不包含CSS浏览器前缀

例如：

solar.svg？size=800&bbox=160&noPrefixes

---

对我来说，接下来的步骤将是根据TLE数据计算轨道和实际行星位置。在当前版本中，行星在其轨道上处于随机位置，当然轨道也不是那么精确。

这可能来得有点晚，但我自己也在努力解决同样的问题，并试图找到一些解决方案

我认为SVG不支持3D旋转，但可以使用CSS3变换

是我用CSS转换制作的SVG示例

对于不带CSS浏览器前缀（-webkit，-moz等）的更干净的SVG。在这个版本中，至少Chrome无法渲染3D变换，SVG中的轨道可能看起来有点像步骤3之前的版本

您可以将url参数用于SVG文件的其他变体：

• 大小：数字–>SVG的大小（以像素为单位）
• bbox:number–>以AU为单位的边界框的大小（1-200）
• noPrefixes–>不包含CSS浏览器前缀

例如：

solar.svg？size=800&bbox=160&noPrefixes

---

对我来说，接下来的步骤将是根据TLE数据计算轨道和实际行星位置。在当前版本中，行星在其轨道上的随机位置，当然轨道也不是那么精确。

这也来得很晚，但我刚刚看到了你的帖子……在花了几个月的时间后，我自己解决了这个问题

做这件事没有直接的公式。您需要在3D中沿三个轴旋转椭圆，这是通过使用旋转矩阵完成的。使用SVG实现这一点的捷径是……你不能

如果你使用一些天文馆软件，你会看到一些确实为一些物体绘制了轨道椭圆，比如行星卫星。我问一个天文馆软件的构思者它是如何完成的，他告诉我，他们只是围绕轨道计算很多点，用3D旋转每个点（用矩阵），然后“连接点”。这个过程可能需要大量处理器，并且需要“很长”的时间（从计算机角度看，甚至一秒钟都是“很长的”！），所以我希望有一个不同的方法，就像我过去做的那样

然后，我意识到要画一个椭圆，一个人只需要沿着椭圆的五个点，所以不需要这样一个连接点的程序。我的方法是3D矩阵沿椭圆仅旋转五个点。这些很容易确定：

• 上升节点<