javascript - 如何使用 Path2D (或任何形状抽屉)在 Java 中绘制 SVG 路径点？

Question

我一直在寻找一种从 SVG 获取点并将其应用到 Path2D 画家中的方法。

解析任务不是我的重点，问题是了解点在 Canvas 中的工作原理以及如何将其应用到 Path2D。

例如，假设我有这个 SVG 标签:

<svg>
    <path d = "
    m 51.688 5.25
    c 10 20 30 40 50 60
    z">
    </path>
</svg>

这只是将抽屉移动到第一个点，使用这些点绘制一条曲线并闭合路径。

我尝试将其应用于 Path2D，如下所示:

float x = 200, y = 200;
Path2D.Float painter = new Path2D.Float();

painter.moveTo(51.688+x, 5.25+y);
painter.curveTo(10+x, 20+y, 30+x, 40+y, 50+x, 60+y);
painter.closePath();

由于 SVG 中的点是相对的，我将 x 和 y 字段求和为点，但得到了以下结果:

这只是一个小测试，用于检查绘图是否有效，我需要将其用于更复杂的路径，并且由于我需要绘制最多 50 个 SVG 路径 Batik 不是一个好方法，考虑到只渲染我的项目的一张 svg 图像太慢了。

然后我需要知道是否可以像这样直接使用它的点绘制SVG路径。如果是，如何修复我的想法？如果没有，如何绘制路径？ P.s.:我的目标是 swing。

Answer 1

如果您想了解 SVG 路径命令的工作原理，最好的来源是阅读 SVG specification 。那里都解释得很清楚了。我不知道你为什么先来这里问。

小写路径命令(如c)是相对。它们的坐标应被视为距最后一个路径段终点的偏移。

所以相当于你的路径描述应该是:

painter.moveTo(51.688, 5.25);
painter.curveTo(51.688 + 10, 5.25 + 20, 51.688 + 30, 5.25 + 40, 51.688 + 50, 5.25 + 60);
painter.closePath();

(为了清楚起见，我在这里省略了 x 和 y 参数)。