Mathjax后备:图像字体之前尝试SVG如果HTML,CSS web字体失败

问题描述:

(我使用STIX的字体,但问题是有关对TeX的字体以及。)Mathjax后备:图像字体之前尝试SVG如果HTML,CSS web字体失败

我的问题:如何在配置mathjax我网页,以便查看该页面的用户体验以下1 - > 2 - > 3后备链?

  1. HTML,CSS(web字体 “STIX的Web”,当地 “STIX”)
  2. SVG( “STIX的Web”)
  3. 所有其他备用选项(当地通用的,图像等)

换句话说,这个想法是保持HTML-CSS为首选,但如果HTML-CSS失败,则返回,然后回退到SVG,而不是本地通用或图像字体

回退需要适用于(1)的各种故障。例如,当HTML-CSS中的本地字体无法使用时(或者因为用户没有本地安装的字体,或者因为我通过availableFonts: []preferredFont: null显式禁用网页中的本地字体),以及HTML -CSS网页字体无法使用(用户已禁用网页字体,浏览器实施相同的原始策略等)。

它也应该独立于客户端用户在数学上下文菜单中最后一次选择渲染器。目前,如果在客户端浏览器中用户通过数学菜单上次选择了HTML-CSS作为渲染器,则每当(1)失败时,mathjax将回落到(3),跳过(2)。如果用户最后选择了SVG作为渲染器,那么HTML-CSS不再是第一选择,即(1)被完全跳过。

+0

我想弄清楚,这是一个_SERVER side_问题:如何在我的网页配置mathjax让我的网页浏览者看到上面的后备行为? – GDGP

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

<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>