Javascript 如何将VML路径转换为SVG路径？

我目前正在开发一个应用程序，需要将VML形状转换为SVG形状。虽然我可以处理它的所有其他方面，但在正确地将形状的

路径

从VML路径转换为SVG路径方面，我面临着一个问题。我在代码中结合使用XSLT和Javascript

我对角度形状（即仅包含直线的形状）的转换有足够的控制，但我在使用曲线转换路径时面临困难

例如，对于简单形状：

VML路径为：

m10800、QX21600108001600L、21600、xe

现在，如果我将

m

替换为

m

，

l

替换为

l

，

qx

替换为

Q

，并对坐标进行必要的缩放，我会得到以下SVG形状：

SVG路径将

Q/qx

中的第一组坐标视为控制点，因此实际路径不通过该点，而VML将这些坐标视为路径应通过的点。我不明白如何使用SVG实现这一点（即确保路径通过一个或多个特定点）

目前我正在使用和分别研究SVG和VML。我也试过使用，但也不起作用

有人能给我推荐一种方法、一个图书馆、任何学习链接或教程，让我找到解决问题的方法吗

提前谢谢

VML中的“qx”是“椭圆象限”，SVG中的“Q”是二次贝塞尔曲线。完全不同的事情

转换“qx”的最简单解决方案是用三次贝塞尔近似。使用圆弧是最精确的，但要确定“扫描标志”的正确值，还需要一些复杂的数学运算。虽然三次贝塞尔并非象限的完美近似值，但它非常接近，并且误差不会明显到足以影响图形

绘制圆形/椭圆形象限的秘诀是常数0.5522847498。它定义了控制点线必须多长才能模拟椭圆曲线。你可以通过谷歌搜索这个数字来解释它是如何推导出来的

所以VML将“qx”定义为一个从X方向开始的椭圆象限。因此，给定路径命令“QX2160010800”，转换算法为：

arcFactor = 0.5522847498;
currentX = 10800;
currentY = 0;      // start coords (from the move)

x = 21600;
y = 10800;  // first coords in "qx"

dx = x - currentX;
dy = y - currentY;

// Calculate first control point
cp1x = currentX + dx * arcFactor;
cp1y = currentY;   // starts out horizontal

// Calculate second control point
cp2x = x;
cp2y = y - dy * arcFactor;

svgBezier = "C" + cp1x + "," + cp1y + "," + cp2x + "," + cp2y + "," + x + "," + y;

现在，曲线有第二组到qx的坐标。规范说这意味着“qx”命令的重复。但是，第二组的行为与qx完全相同（即水平开始）是没有意义的。因此，我认为它们实际上必须表现为“qy”（从垂直方向开始）。即，qx和qy交替。假设是这种情况，qy的计算应为：

// Calculate first control point
cp1x = currentX;   // starts out vertical
cp1y = currentY + dy * arcFactor;

// Calculate second control point
cp2x = x - dx * arcFactor;
cp2y = y;

---

对于qx，currentY y的值不应该等于零吗？是的，你是对的。我已经修好了。不过，演示中的代码是正确的。我很想知道更多关于0.5522847498的来源，我发现了以下内容：和。“这是k=0.5522847498，通常被称为“幻数”。我不是在编这个。”如果你使用贝塞尔函数，插入四分之一圆上45度点的坐标（即x=1/sqrt（2）；y=1/sqrt（2））。最后得到的值是（4/3）*（sqrt（2）-1）=0.5522847498。如果你想自己做一点数学练习，其实并不难：）