使用 python，如何预测 SVG 中文本的像素宽度？答案

【问题标题】：using python, how do I predict the pixel width of text in an SVG?使用 python，如何预测 SVG 中文本的像素宽度？
【发布时间】：2016-05-16 17:39:19
【问题描述】：

我正在使用 python 生成一个带有可以变化的文本的 SVG，我想在它后面放置一个半透明的矩形，以保证稍后在另一个图形元素上覆盖时有一定的对比度。

不幸的是，我不知道如何预测 SVG 中特定文本字符串的像素范围。我可以选择我使用的字体（但我不认为等宽字体可以接受）以及我使用的字体大小。

如何使用 python 来预测 SVG 文本的范围，以便生成适当大小的矩形？

【问题讨论】：

标签： python svg

【解决方案1】：

我认为如果您在 Python 中执行此操作，事情会变得一团糟。可能压力最小的方法是安装FreeType 并使用它为您计算文本尺寸。但对于一个很小的坚果来说，这是一把非常大的锤子。

This answer 展示了一种更简单的方法 - 使用 SVG 过滤器将背景直接应用于文本，而无需调整任何内容。

您也可以将此方法用于半透明背景：

<svg width="360" height="100" viewBox="0 0 360 100">
  <defs>
    <filter x="0" y="0" width="1" height="1" id="text-bg">
      <feFlood flood-color="#ff0" flood-opacity="0.5" />
      <feComposite in="SourceGraphic" />
    </filter>
  </defs>
  <rect x="0" y="0" width="400" height="100" fill="#444" stroke="none" />
  <path d="m0 10 40 80 40-80 40 80 40-80 40 80 40-80 40 80 40-80 40 80"
        stroke="#888" stroke-width="10" fill="none" />
  <text font-family="Arial" font-weight="bold" filter="url(#text-bg)"
        x="180" y="50" font-size="20" fill="#000" text-anchor="middle">
    Edit this text and reload the SVG
  </text>
</svg>

【讨论】：

这是一个非常有用的技术。虽然它可能构成我最终解决方案的基础，但我还没有弄清楚如何使框在文本周围形成一个固定的（例如 10 像素）边距。我会继续试验。
我接受了您的“大锤”建议并安装了 freetype-py。我可以在搅拌机中运行它来写出用于 VSE 图像条的 PNG。它没有回答这个特定的问题，但它完成了提出这个问题的使命。