如何在 MathJax-Node 中更改 SVG 的默认颜色

Question

我正在使用MathJax-node 生成方程的 SVG。我想更改默认颜色，但到目前为止没有任何效果。

我看了this answer 并尝试了

mjAPI.config({MathJax: {
   styles: {
    ".MathJax_SVG, .MathJax_SVG_Display": {
      fill: "#FFF",
      stroke: "#FFF"
    }
  }}});

我也试过了

mjAPI.config({MathJax: {
   SVG: {color: "#0FF", fill: "#0F0", stroke: "#F00"}}});

还有几个变体，比如包括SVG 下的styles，但到目前为止没有任何效果。

我可以通过在 TeX 表达式中设置样式来解决这个问题，但我更希望能够设置默认配置，这样我就可以在不更改表达式的情况下处理表达式。

Answer 1

MathJax-node 使用fill="currentColor stroke="currentColor" 将其输出包装在一个组中，以便它从周围的文本中继承颜色。因此，更改颜色的一种方法是设置将保存 SVG 输出的容器的颜色。您在上面给出的配置将在浏览器中为 MathJax 执行此操作，因为 MathJax 将其 SVG 输出包围在一个带有 class="MathJax_SVG" 或 class="MathJax_SVG_Display" 的容器中；但 MathJax-node 不会像 MathJax 那样生成容器 HTML 元素，因此不会生成类 MathJax_SVG 或 MathJax_SVG_Display 的元素。在任何情况下，样式都会被放入将添加到页面的样式表中，而不是用于将显式样式添加到生成的 SVG 中，因此您必须将该样式表包含在按顺序放置 SVG 输出的页面中即使正在生成具有正确类的容器，上述配置也会产生影响。

但是，您可能想要的是让currentColor 成为某种特定颜色，这样就不会继承颜色。因为 SVG 是基于文本的图像格式，所以您可以在 mathjax-node 驱动程序文件中使用字符串替换来做到这一点。例如：

mjAPI.typeset({
  math: "x+1",
  format: "TeX",
  svg: true,
  useFontCache: false,
  ex: 6, width: 100
}, function (data) {
  if (!data.errors) {
    console.log(data.svg.replace(/"currentColor"/g, '"red"'));
  }
});

会在输出中将颜色设置为红色。