使用 CairoSVG 进行文本渲染时出现问题

Question

我正在使用 CairoSVG 将 SVG 文件转换为 PNG 图像。 与 Firefox、Safari 等渲染的图像相比，文本的位置似乎有所偏差。我不明白问题是来自代码、来自 CairoSVG 还是来自 SVG 文件。

这是 SVG 文件的 URL：https://upload.wikimedia.org/wikipedia/commons/7/7d/Roll_pitch_yaw_mnemonic.svg

这是使用 CairoSVG 生成的图像：

这是我正在使用的Python代码：

import cairosvg
URL = "https://upload.wikimedia.org/wikipedia/commons/7/7d/Roll_pitch_yaw_mnemonic.svg"
cairosvg.svg2png(url=URL, write_to="output.png")

我错过了什么还是这是一个已知问题？ 如果是这样，有没有比 CairoSVG 更好的库？

Answer 1

这是一种不同的渲染行为，可能是由于您的桌面安装的字体中的错误所致，该字体由 cairo 使用，或在 cairo-sg 本身中。

查看这个特定 SVG 的源代码，很明显，当单词没有额外的类

tspan

文本标记时，会出现不需要的偏移。

您可以尝试通过以下方法解决此问题：删除不需要其他样式的文本范围的冗余

tspan

标记； (2) 检查您安装的可用于 cairo 的字体 - 字体的后备序列是：

Helvetica,Arial,sans-serif;

- 我记得很多年前使用过时字体格式的

Helvetica

字体的经历很糟糕 - 和这将是第一个在那里使用的。 (3)：手动调整放错位置的元素的负左填充值，直到它们落在正确的位置。