Question

（我使用的是STIX字体，但问题也与TeX字体有关。）

我的问题：如何在我的网页上配置mathjax，以便查看该页面的用户体验以下1 - ＆gt; 2 - ＆gt; 3后备链？

HTML-CSS（webFont＆＃34; STIX-Web＆＃34;，local＆＃34; STIX＆＃34;）
SVG（＆＃34; STIX-Web＆＃34;）
所有其他后备选项（本地通用，图片等）

换句话说，我们的想法是将HTML-CSS作为首选，但如果HTML-CSS失败，则返回SVG，而不是本地通用或图像字体。

后备需要适用于（1）的各种故障。例如，当HTML-CSS中的本地字体无法使用时（无论是因为用户没有本地安装的字体，还是因为我通过availableFonts: []和{{1}明确禁用了网页中的本地字体，它都应该工作。并且，当无法使用HTML-CSS Web字体时（用户已禁用webfonts，浏览器同源策略得到强制执行等）。

它还应该独立于客户端用户在数学上下文菜单中最后选择的渲染器。目前，如果在客户端浏览器上用户最后通过数学菜单选择了HTML-CSS作为渲染器，则只要（1）失败，mathjax就会回退到（3），跳过（2）。如果用户最后选择SVG作为渲染器，那么HTML-CSS不再是首选的选择，即（1）被完全跳过。

Answer 1

以下配置似乎实现了所需的回退链（在我的有限测试中）。

<script type="text/javascript"
  src="../MathJax-2.7.1/MathJax.js?config=TeX-AMS-MML_SVG">
</script>

<script type="text/x-mathjax-config">
//
// - Mathjax config to implement the following fallback chain:
//
//     1. HTML-CSS webFont ("STIX-Web")
//     2. SVG ("STIX-Web")
//     3. Other fallback fonts (local generic, image, etc)
//
// - Change availableFonts to ["STIX"] and preferredFont to "STIX"
//   to allow local STIX fonts. Implements the fallback chain below:
//
//     1. HTML-CSS local ("STIX")
//     2. HTML-CSS webFont ("STIX-Web")
//     3. SVG ("STIX-Web")
//     4. Other fallback fonts (local generic, image, etc)
//

//
// Use STIX font consistently across HTML-CSS and SVG
//
MathJax.Hub.Config({
    jax: ["input/TeX", "input/MathML",
        "output/HTML-CSS", "output/SVG", "output/PreviewHTML"
    ],
    "HTML-CSS": {
        imageFont: null,
        webFont: "STIX-Web",
        availableFonts: [],    // Or: ["STIX"], to allow local
        preferredFont: null    // Or: "STIX", to allow local
    },
    "SVG": {
        font: "STIX-Web"
    }
});

MathJax.Hub.Register.StartupHook("End Jax", function() {

    // 1. Set HTML-CSS as the initially preferred output processor.
    //    (Temporarily overrides the renderer value set by MathMenu
    //    without affecting the user's chosen renderer elsewhere.)
    var jax = "HTML-CSS";
    MathJax.Hub.setRenderer(jax);

    // 2. Install callback which switches renderer to SVG if HTML-CSS fails.
    var nopast = true;
    MathJax.Hub.Startup.signal.Interest(QueSVGfallback, nopast);

});

</script>

<script>
//
// This callback (when installed) scans through messages to check
// (as in FontWarnings.js) if HTML-CSS font loading has failed.
// If so, it queues a request to switch to SVG rendering.
//
var QueSVGfallback = (function() {    // Anonymous "closure" to keep quecount
    var quecount = 0;
    return function(m) {              // The real callback function
        if (quecount > 0) return;     // Prevent multiple queueing
        m = m + "";
        if (m.match(/HTML-CSS Jax - /)) {
            if (m.match(/- using image fonts/) ||
                    m.match(/- no valid font/) ||
                    m.match(/- disable web fonts/)) {
                MathJax.Hub.Queue(
                    ["setRenderer", MathJax.Hub, "SVG", "jax/mml"],
                    ["Rerender", MathJax.Hub]
                );
                quecount++;
            }
        }
    }
})();
</script>

Mathjax后备：如果HTML-CSS webfont失败，请在图像字体之前尝试SVG

1 个答案: