在 Python 中处理 SVG 路径

快速解答： 要在 Python 中处理 SVG 路径，请使用 SVGDocument 加载文件，使用 Element.query_selector() 查找 <path> 元素，使用 set_attribute() 替换其 d 属性，然后保存编辑后的 SVG。

from aspose.svg import SVGDocument

with SVGDocument("document.svg") as document:
    path = document.root_element.query_selector("#wave-path")
    if path is not None:
        path.set_attribute("d", "M40 125 C90 65 150 65 200 125 S310 185 370 95")
    document.save("edited.svg")

在本文中，您将学习如何：

• 替换 SVG <path> 的完整 d 属性；
• 从坐标、尺寸或点等更容易输入的形状值构建 path data；
• 向已知模板追加受控路径片段；
• 判断何时应该编辑 path data，何时应该使用 transform 属性。

SVG path data 存储在 <path> 元素的 d 属性中。它包含绘图命令，例如 M 表示移动，L 表示直线，C 表示三次贝塞尔曲线，Q 表示二次曲线，Z 表示闭合路径。编辑这个值会改变路径的实际几何形状，而不仅仅是它的渲染位置。

当您需要改变轮廓本身时，请编辑 path data。如果只是移动、旋转或缩放已有形状，请改用 transform 属性。有关变换工作流，请参阅 在 Python 中移动、旋转和缩放 SVG 元素。

Path Data 编辑基础

最安全的工作流是用已知有效的路径字符串替换整个 d 值。这适用于图标、生成的图表、简单标记，以及路径具有稳定 ID 的 SVG 模板文件。

任务	编辑内容	适用场景
改变路径轮廓	d 属性	形状几何必须改变
移动或缩放同一轮廓	transform 属性	形状应保留原始坐标
从形状参数生成路径	从坐标、尺寸或点构建的 d 属性	用户输入用形状值描述比用路径命令更容易
重新着色或修改路径样式	fill、stroke、style	只有外观发生变化

如何在 Python 中编辑 SVG path data

当已有 SVG 包含 <path> 元素，并且需要改变其几何形状时，请使用以下简短工作流：

1. 使用 SVGDocument 加载 SVG 文件。
2. 通过 ID、标签名或其他稳定选择器查找目标 <path>，例如使用 query_selector()。
3. 准备有效的 d 值。您可以编写完整路径字符串，从坐标、尺寸或点等形状参数构建，也可以在受控模板中追加已知片段。
4. 使用 set_attribute() 设置新的路径数据，例如 set_attribute("d", path_data)。
5. 使用 document.save() 保存编辑后的 SVG，并打开输出文件检查新几何形状。

下面的示例遵循相同步骤，但新 d 值的来源不同。

替换 SVG path data

代码示例使用 python-edit-svg-path-data.svg 作为输入文件。在第一个工作流中，代码查找 #wave-path，用新曲线替换其 d 属性，并将结果保存为 path-data-replaced.svg。

import os
from aspose.svg import SVGDocument

input_folder = "data/"
output_folder = "output/"
input_path = os.path.join(input_folder, "python-edit-svg-path-data.svg")
output_path = os.path.join(output_folder, "path-data-replaced.svg")
os.makedirs(output_folder, exist_ok=True)

new_path_data = "M30 140 C85 60 155 80 220 120 S320 180 380 90"

with SVGDocument(input_path) as document:
    wave_path = document.root_element.query_selector("#wave-path")

    if wave_path is not None:
        wave_path.set_attribute("d", new_path_data)

    document.save(output_path)

代码改变了波形路径的几何形状。它不修改 stroke 或 fill，因此视觉样式保持不变，而曲线形状发生变化。下图比较源 SVG (a) 和 path-data-replaced.svg (b)。

从矩形坐标构建 Path Data

当输入来自表单、数据库、图表布局或应用程序的其他部分时，手写 d 属性很不方便。用户和应用数据通常用 x、y、width 和 height 描述矩形，而不是用 SVG 路径命令。

下一个示例保留这种对用户友好的输入模型。它接收矩形坐标，将其转换为路径命令，把这些命令写入现有 #marker-path，并将结果保存为 path-data-from-rectangle.svg。源标记是三角形，但新几何形状有意生成矩形。当模板必须保留 <path> 元素，而应用程序或用户界面收集的是简单矩形值时，这种方法很有用。图标集、遮罩和可复用模板通常要求使用路径，即使输入数据更容易描述为一个框。

import os
from aspose.svg import SVGDocument

input_folder = "data/"
output_folder = "output/"
input_path = os.path.join(input_folder, "python-edit-svg-path-data.svg")
output_path = os.path.join(output_folder, "path-data-from-rectangle.svg")
os.makedirs(output_folder, exist_ok=True)

rect_x = 60
rect_y = 20
rect_width = 80
rect_height = 60

rect_path_data = (
    f"M{rect_x} {rect_y} "
    f"H{rect_x + rect_width} "
    f"V{rect_y + rect_height} "
    f"H{rect_x} Z"
)

with SVGDocument(input_path) as document:
    marker_path = document.root_element.query_selector("#marker-path")

    if marker_path is not None:
        marker_path.set_attribute("d", rect_path_data)

    document.save(output_path)

代码不要求用户编写 M、H、V 或 Z 命令。它接受普通矩形值，并从中生成有效的 SVG path data。现有 <path> 保留其 fill、stroke 和其他属性，只有存储在 d 中的几何形状发生改变。

下图比较源 SVG (a) 和 path-data-from-rectangle.svg (b)。

在受控模板中追加路径片段

当输入路径是受控模板，并且您知道当前路径在哪里结束时，可以向已有 path data 追加命令。下面的示例读取 #wave-path 的当前 d 值，追加一个线段，并保存 path-data-extended.svg。

import os
from aspose.svg import SVGDocument

input_folder = "data/"
output_folder = "output/"
input_path = os.path.join(input_folder, "python-edit-svg-path-data.svg")
output_path = os.path.join(output_folder, "path-data-extended.svg")
os.makedirs(output_folder, exist_ok=True)

with SVGDocument(input_path) as document:
    wave_path = document.root_element.query_selector("#wave-path")

    if wave_path is not None:
        current_path_data = wave_path.get_attribute("d").strip()
        wave_path.set_attribute("d", current_path_data + " L395 95")

    document.save(output_path)

只有在源路径可预测时才使用这种方法。对于任意 SVG 文件，path data 可能包含相对命令、多个子路径、简写命令或闭合形状。在这些情况下，替换完整 d 值或使用专门的 SVG 路径解析器，比基于假设编辑命令文本更安全。

下图比较源 SVG (a) 和 path-data-extended.svg (b)。新增线段从原始波形路径的末端继续延伸，因此只有在已知端点和命令上下文时，才应使用这种技术。

常见错误和修复

问题	修复
路径消失	检查新的 d 值是否为有效 SVG path data，并以 M 等移动命令开头
路径移动了，但形状没有改变	您编辑的是 transform 而不是 d；当几何本身必须改变时，请编辑 d
输出文件没有变化	编辑后保存文档，并打开输出路径，而不是输入 SVG
追加命令产生奇怪形状	只有在知道路径当前端点和命令类型时才追加；否则替换整个 d 值
矩形输出位置不正确	构建 d 字符串前检查 x、y、width 和 height 值
曲线效果与预期不同	检查路径使用的是三次 C、二次 Q、平滑 S 或 T 命令，还是小写相对命令

常见问题

如何在 Python 中编辑 SVG path data？

使用 SVGDocument 加载 SVG，找到目标 <path> 元素，然后调用 set_attribute("d", new_path_data)。更新 d 属性后保存文档。

SVG 的 d 属性是什么？

d 属性存储定义 <path> 元素几何形状的路径命令。M、L、C、Q 和 Z 等命令描述移动、直线、曲线和闭合路径。

应该编辑 path data 还是使用 transform？

当实际轮廓必须改变时，请编辑 d。当只需要移动、旋转或缩放已有轮廓，而不重写其坐标时，请使用 transform。

可以向已有 SVG path data 追加命令吗？

可以，但只适用于受控输入，即您知道当前端点和命令上下文。对于任意 SVG 文件，请替换完整 d 值，或先解析 path data 再修改。

可以用 query_selector_all() 编辑所有路径吗？

不可以，至少不适用于本文展示的 set_attribute("d", ...) 工作流。在 Aspose.SVG for Python via .NET 中，query_selector_all() 返回的项可能是 Node 对象，而这些对象不提供 set_attribute()。如果要更新多个路径的 d 属性，请使用 document.get_elements_by_tag_name("path")，遍历返回的元素，并对每个元素调用 set_attribute()。

相关文章

• 在 Python 中绘制 SVG 和处理路径 介绍绘图工作流、基本形状、路径、坐标和图标创建。
• 在 Python 中移动、旋转和缩放 SVG 元素 解释何时使用 transform 而不是重写 path data。
• 在 Python 中使用 CSS 选择器编辑 SVG 元素 展示如何用 ID、类和限定选择器查找 SVG 元素。
• 处理 SVG 属性 解释如何读取、更新、检查和删除 SVG 属性。
• 在 Python 中编辑 SVG 样式 介绍路径和其他 SVG 元素的样式编辑。
• 在 Python 中更改 SVG 颜色 解释如何更新路径的 fill、stroke 和样式颜色。