ブラウザで数式がちゃんと表示されない?なんかおかしい時の対処法

コンピュータ関連
スポンサーリンク

とあるサイトを読んでいて、

数式がちゃんと表示されていない ことに気がついた。

分数の横線「括線(かっせん)」が表示されていないので、式がもんのすごく読みにくい。

なんとなく横線あるんだろうなぁ、と思いながら読んでいたけど読みづらいにも程がある。

普段から接するような内容じゃなかったので一瞬戸惑いましたが、対処法があったので短めですが記事としてシェア。

スポンサーリンク

数式がちゃんと表示されてない!?

改めて勉強しようかと、とあるサイトを読み進めていた時、こんな表示にぶつかった。

数式

ん?どゆこと?
まぁ内容的に横線(括線)が表示されてないだけだろうと。
もしかして知らない間に表示倍率が変わって?表示がおかしくなってるのかもと確認したけど問題ない。

先に進むとさらに読みづらさは増してくる。

数式

さすがにイライラしてしまう。

解決法:数式がちゃんと表示されない時はレンダラーを変更

環境:Mac Sonoma,Firefox 149

数式を表示するのに MathJax というJavaScriptライブラリを使っている場合に起こるようだ。しかも古いバージョンの時に。

MathJaxを使っている場合は数式上で右クリックするとメニューが現れる。

数式

Math Settings > Math Renderer > Common HTML

などに変更するとちゃんと表示された。
デフォルトの HTML-CSS だと表示が崩れるらしい。

これでOK

数式

MathJaxのバージョンが古いと発現する?

画像で数式を表示しているところも多く、そういった場所ではもちろん問題がないのだけれど、
前述の通り、バージョンが古いMathJaxを使っている場合に問題が発生する。

問題があったサイトはMathJaxのバージョンが v2.7.7

v2.7.7

バージョン v3.2.2 を使っているサイトだと問題なく表示される。
v3.2.2

レンダラーは変えても変えなくても問題ない。どちらでもちゃんと表示されている。

レンダラー

バージョンが 3.x以降 であれば問題なく表示されるようだ。

まとめ

古いサイトで、古いバージョンのまま残っている場合に問題が生じるようです。

ちなみに safari(ver 26.3) で開いたら問題なく表示されていました。

FirefoxやChromeなんかで表示が崩れるらしい。

今回の問題は

  • MathJax の古いバージョンを使っていること
  • FirefoxやChromeで開いていること

というかなり限られた条件に合致した時にしか発現しないと思われる。が、一般的にないとも言えないので備忘録も兼ねて記事化。

何かの参考になれば幸いです。

コメント

タイトルとURLをコピーしました