如何在MathJax节点中更改SVG的默认颜色

Question

我正在使用MathJax节点生成方程的奇异值。我想更改默认颜色，但到目前为止一切都不起作用。

我看了看这个答案，试了试

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

我也试过

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

以及一些变体，比如将styles包含在SVG之下，但到目前为止，一切都不起作用。

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

Answer 1

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

然而，您可能希望currentColor是某种特定的颜色，这样就不会继承颜色。因为SVG是一种基于文本的图像格式，所以可以在mathjax节点驱动程序文件中使用字符串替换来实现这一点。例如：

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"'));
}
});

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