技术求助：如何将图像映射坐标转换为SVG路径格式？

嘿，我帮你梳理两种靠谱的方法，不管你是已经拿到了坐标数据，还是想直接从PS导出，都能搞定！

方法一：直接从PS导出SVG路径（最省心） #

这是最简单的方式，不用手动处理坐标：

• 打开你的PS文件，确保选区已经激活，切换到「路径」面板（如果没显示，就去「窗口」菜单里调出）
• 点击面板底部的「从选区生成工作路径」按钮（就是那个圆圈套钢笔的图标），选区会变成平滑的路径
• 右键点击生成的工作路径，选择「导出路径到Illustrator」，保存为AI格式文件
• 用Adobe Illustrator打开这个AI文件，然后选「文件→导出→导出为SVG」，调整好导出设置（比如勾选「响应式」），导出后打开SVG文件，里面的<path>标签就是你要的纯路径数据
• 进阶小技巧：如果你的PS版本比较新（比如CC 2020+），可以直接选中路径后，用「文件→导出→导出为」，直接选SVG格式导出，省掉AI那一步！

方法二：手动/脚本转换已有坐标到SVG路径 #

如果你已经拿到了选区的坐标列表，那就可以直接转换成SVG的路径语法：
SVG路径的核心是d属性，基本规则是：

• M x y：指定路径的起点（Move to）
• L x y：从当前点画直线到目标点（Line to）
• Z：闭合路径（如果你的选区是封闭形状）
• 如果是曲线选区，会用到C cx1 cy1 cx2 cy2 x y（三次贝塞尔曲线）或者Q cx cy x y（二次贝塞尔曲线），对应PS路径里的控制点

举个实际例子：
假设你的选区坐标是(15, 25), (40, 60), (75, 30), (15, 25)，对应的SVG路径就是：

<path d="M 15 25 L 40 60 L 75 30 Z" fill="none" stroke="#000"/>

如果坐标点特别多，手动写太费时间，用个简单的Python脚本批量生成：

# 把你的选区坐标放到这个列表里
selection_coords = [(15,25), (40,60), (75,30), (15,25)]

# 生成路径d属性内容
path_data = f"M {selection_coords[0][0]} {selection_coords[0][1]}"
for x, y in selection_coords[1:]:
    path_data += f" L {x} {y}"
# 闭合路径加Z
path_data += " Z"

# 输出完整的SVG路径标签
print(f'<path d="{path_data}" fill="none" stroke="black"/>')

运行脚本就能直接复制使用了~

注意：PS和SVG的坐标原点都是左上角，所以不用翻转Y轴，坐标可以直接复用！

内容的提问来源于stack exchange，提问作者Mikerobenics