Top 8

MathJaxの描画がプレビューで止まってしまう場合の対処

Nov. 12, 2022, 4:13 p.m. edited Nov. 12, 2022, 5:04 p.m.

#LaTeX

なんだか MathJax の描画が

のような中途半端な状態で止まってしまうことがたまにある。割と読めるので放置していたが、よくよく見ると数式番号が表示されていないことに気づいたため対応することにした。おそらくページの描画に JavaScript を利用していると起こるケースが存在するように感じる。この中途半端な状態の MathJax はプレビュー状態であり、実際にブラウザの開発者モードのインスペクタで調査してやると MathJax_Preview というクラスが付与されたものが表示されている。

一方、我々がほしいのは処理が完了したものである。これは既に作られているものの display: none のままにされてしまっている場合と、そもそも作られていない場合の 2 種類が存在する。ゆえに、その 2 種類それぞれに対応した修正スクリプトを作ってやればとりあえず動くだろう：

<script>
let MJXc_processed_id;
let MJXc_processed_cnt = 0;
let found_MJXc_processed = false;
MJXc_processed_id = setInterval(() => {
        let MJXc_processed = document.getElementsByClassName('MJXc-processed');
        if(MJXc_processed.length > 0) {
                found_MJXc_processed = true;
                for(let elem of MJXc_processed) {
                        elem.classList.remove('MJXc-processed');
                }
                let MathJax_Preview = document.getElementsByClassName('MathJax_Preview');
                for(let elem of MathJax_Preview) {
                        elem.style.display = 'none';
                }
        }
        if(++MJXc_processed_cnt > 10) {
                clearInterval(MJXc_processed_id);
                if(!found_MJXc_processed) {
                        MathJax.Hub.Typeset();
                }
        }
}, 1000);
</script>

これを適当に <head>...</head> においてやると、遅くとも 10 秒後くらいには