适合 Unicode 上标的便携式字体

Question

我正在使用 GraphViz 生成节点为数学公式的图形，类似于多项式，带有指数。我使用 UTF-8 上标来渲染它们，有几个原因（首先使用 GraphViz 对 <SUP>...</SUP> 的支持会产生一个丑陋的结果，指数太大，甚至与节点的框架发生碰撞，其次因为我也使用相同的 UTF-8 渲染来显示文本结果。

令我最失望的是，我发现，至少在 Mac OS X (El Capitan) 上，大多数字体对上标的支持非常差：通常 123 不会像 0456789 那样呈现.

例如，在 Courier 和 Geneva 中，它们以粗体显示：

在 Helvetica 中，它们是粗体且太高且未对齐：

摩纳哥好不到哪儿去：

和大多数其他知名字体（Times 等）只是缺少这些字形，所以渲染引擎，我想，会寻找其他字体的替代品。这是这个 GraphViz 文件 digraph {"a⁰¹²³⁴⁵⁶⁷⁸⁹"}:

在 Times New Roman 中的渲染

既然是数学题，我还真不急于用Courier之类的等宽字体。因为我的工作在多个环境的多台计算机上使用，所以我正在寻找尽可能便携的解决方案。

所以我的问题是：人们会推荐哪种字体与 GraphViz 一起用于 SVG 渲染，以便我可以优雅地渲染包含指数的数学公式？

Answer 1

优雅是在情人眼中，但这里是一个 Graphviz 程序，它将以 43 种不同的字体显示上标。 （不可否认，有几个是失败者）。享受吧！

digraph s {
  rankdir=LR 
  subgraph cluster_1 { label="arial"
    node_1 [fontname="arial" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_2 { label="AvantGarde-Book"
    node_2 [fontname="AvantGarde-Book" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_3 { label="AvantGarde-BookOblique"
    node_3 [fontname="AvantGarde-BookOblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_4 { label="AvantGarde-Demi"
    node_4 [fontname="AvantGarde-Demi" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_5 { label="AvantGarde-DemiOblique"
    node_5 [fontname="AvantGarde-DemiOblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_6 { label="Bookman-Demi"
    node_6 [fontname="Bookman-Demi" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_7 { label="Bookman-DemiItalic"
    node_7 [fontname="Bookman-DemiItalic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_8 { label="Bookman-Light"
    node_8 [fontname="Bookman-Light" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_9 { label="Bookman-LightItalic"
    node_9 [fontname="Bookman-LightItalic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_10 { label="calibri"
    node_10 [fontname="calibri" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_11 { label="courier"
    node_11 [fontname="courier" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_12 { label="Courier"
    node_12 [fontname="Courier" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_13 { label="Courier-Bold"
    node_13 [fontname="Courier-Bold" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_14 { label="Courier-BoldOblique"
    node_14 [fontname="Courier-BoldOblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_15 { label="Courier-Oblique"
    node_15 [fontname="Courier-Oblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_16 { label="doxfont"
    node_16 [fontname="doxfont" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_17 { label="helvetica"
    node_17 [fontname="helvetica" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_18 { label="Helvetica"
    node_18 [fontname="Helvetica" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_19 { label="Helvetica-Bold"
    node_19 [fontname="Helvetica-Bold" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_20 { label="Helvetica-BoldOblique"
    node_20 [fontname="Helvetica-BoldOblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_21 { label="Helvetica-Narrow"
    node_21 [fontname="Helvetica-Narrow" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_22 { label="Helvetica-Narrow-Bold"
    node_22 [fontname="Helvetica-Narrow-Bold" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_23 { label="Helvetica-Narrow-BoldOblique"
    node_23 [fontname="Helvetica-Narrow-BoldOblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_24 { label="Helvetica-Narrow-Oblique"
    node_24 [fontname="Helvetica-Narrow-Oblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_25 { label="Helvetica-Oblique"
    node_25 [fontname="Helvetica-Oblique" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_26 { label="monospace"
    node_26 [fontname="monospace" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_27 { label="NewCenturySchlbk-Bold"
    node_27 [fontname="NewCenturySchlbk-Bold" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_28 { label="NewCenturySchlbk-BoldItalic"
    node_28 [fontname="NewCenturySchlbk-BoldItalic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_29 { label="NewCenturySchlbk-Italic"
    node_29 [fontname="NewCenturySchlbk-Italic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_30 { label="NewCenturySchlbk-Roman"
    node_30 [fontname="NewCenturySchlbk-Roman" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_31 { label="Palatino-Bold"
    node_31 [fontname="Palatino-Bold" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_32 { label="Palatino-BoldItalic"
    node_32 [fontname="Palatino-BoldItalic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_33 { label="Palatino-Italic"
    node_33 [fontname="Palatino-Italic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_34 { label="Palatino-Roman"
    node_34 [fontname="Palatino-Roman" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_35 { label="Sans-Serif"
    node_35 [fontname="Sans-Serif" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_36 { label="Symbol"
    node_36 [fontname="Symbol" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_37 { label="Times-Bold"
    node_37 [fontname="Times-Bold" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_38 { label="Times-BoldItalic"
    node_38 [fontname="Times-BoldItalic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_39 { label="Times-Italic"
    node_39 [fontname="Times-Italic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_40 { label="Times-Roman"
    node_40 [fontname="Times-Roman" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_41 { label="verdana"
    node_41 [fontname="verdana" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_42 { label="ZapfChancery-MediumItalic"
    node_42 [fontname="ZapfChancery-MediumItalic" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
  subgraph cluster_43 { label="ZapfDingbats"
    node_43 [fontname="ZapfDingbats" label="A⁰¹²³⁴⁵⁶⁷⁸⁹ B"]
  }
}