[OpenType 1.70 笔记] SVG 表

现在 off 或 ttf 文件都可以包含可选的'SVG '表，这允许定义带有彩色、渐变、动画等效果的 glyphs。

使用 fontTools 工具包里 ttx 命令修改字体文件。以下都是字表的 XML 形式。

SVG Table 格式

导出命令： ttx -t 'SVG ' -o svg.ttx fontfile
导入命令： ttx -m fontfile svg.ttx

<?xml version="1.0" encoding="UTF-8"?>
<ttFont sfntVersion="\x00\x01\x00\x00" ttLibVersion="2.5">

  <SVG>

    <svgDoc endGlyphID="62" startGlyphID="62">
      <![CDATA[
      ... (这里放 SVG 文档)
      ]]>
    </svgDoc>
    <colorPalettes></colorPalettes>

  </SVG>

</ttFont>

注意 svgDoc 元素指定了 GlyphID 的范围，相应地要在 svg 文档中有这样的 id 号，譬如上面是 [62, 62] 的范围，svg 文档里要有 id=”glyph62” 的元素，这个元素下的内容就属于 glyph62。

这样说来，多个 glyph 可以复用一个 svg 文档（基于范围的复用）。

SVG 文档复用格式

<?xml version="1.0" encoding="UTF-8"?>
<ttFont ttLibVersion="3.0">

  <SVG>

    <svgDoc endGlyphID="8" startGlyphID="5">
      <![CDATA[

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">
<g id="glyph5">
<g id="glyph6">
<g id="glyph7">
<g transform="translate(0 -2048) scale(7)">

<g id="glyph8">
    <line fill="none" stroke="#231815" stroke-miterlimit="10" x1="110.997" y1="168.78" x2="108.331" y2="172.05"/>
</g>
    <path fill="#FFFFFF" stroke="#231815" stroke-miterlimit="10" d="M170.544,131.552c0,2.145,0.551,6.229-2.627,6.229
    c-2.65,0-3.494-2.6-3.494-5.463C166.021,132.155,169.272,131.745,170.544,131.552z"/>

</g>
</g>
</g>
</g>
</svg>

]]>
    </svgDoc>
    <colorPalettes></colorPalettes>
  </SVG>

</ttFont>

上面 glyph 5、6、7 共享了相同的 svg 绘图内容，而 glyph 8 使用了部分绘图内容。

Adobe 提供的 FDK 工具包有个 importSVGDocsToSVGTable.py 脚本可以将 SVG 文件导入字体，但是它要求 glyphID 号出现在 SVG 元素上，也就是限制成一个 SVG 对应一个 glyph。