web-dev-qa-db-ja.com

GoogleでMathMLコンテンツをレンダリングできませんChrome

HTMLページにMathMLコンテンツがいくつかあり、ページをGoogleでレンダリングする必要がありますChrome HTTPS接続経由。そこで、以下のリンクに記載されているアプローチに従ってみました。

Mathml方程式の表示

しかし、それは機能しませんでした(私は自分のHTMLページにスクリプトをコピーしました)。次に、GoogleChromeの拡張機能としてchromeのMathJaxプラグインをインストールしようとしました。ファイル内のMathMLの一部がレンダリングされたようですが、エラーが発生しました。MathJaxがレンダリングできることがわかりました。プレゼンテーションMathMLコンテンツがコンテンツMathMLコンテンツをレンダリングできません(ページに両方のタイプのコンテンツがあります)。また、HTTPS接続では機能しませんでした。この問題を解決するための回避策があれば非常に役立ちます。

よろしく、アニルバン

11
Anirban

OPでリンクされている質問 はやや古く、MathMLをxhtmlに含める方法を説明しています(当時は実際には有効ではなかったため、htmlではありません)。 HTML5を使用すると、MathMLを含めるのがはるかに簡単になります。

ChromeはMathMLをサポートしていないため、ポリフィルが必要になります。 MathJaxは、プレゼンテーションとコンテンツの両方のMathMLをレンダリングできます。 http://docs.mathjax.org/en/latest/mathml.html の関連ドキュメントを参照してください。

ただし、作成者は、MathJaxを正しく構成する必要があります。参考までに、Chromeストアのプラグインはサードパーティによって作成されています。また、MathJaxは正しく実行されればhttps上で問題なく動作します。

以下は、実験的機能のmml3.js拡張機能を含む、MathJaxが提供できるすべてのMathML機能を有効にする方法を示す例です。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Fullest MathML support using MathJax</title>
  <script>window.MathJax = { MathML: { extensions: ["mml3.js", "content-mathml.js"]}};</script>
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=MML_HTMLorMML"></script>
</head>
<body>
  <math display="block"> 
    <apply> 
      <plus/> 
      <ci>a</ci> 
      <apply> 
        <minus/> 
        <ci>b</ci> 
        <ci>c</ci> 
      </apply> 
    </apply> 
  </math> 
  <math display="block">
    <mrow>
      <mi>a</mi>
      <mo>+</mo>
      <mrow>
        <mi>b</mi>
        <mo>-</mo>
        <mi>c</mi>
      </mrow>
    </mrow>
  </math>

</body>
</html>
12

私が同じような状況にあったとき、これは私にとって本当にうまくいきました。

これらのスクリプトを<head>に追加します

<script type="text/x-mathjax-config">MathJax.Hub.Config({
  config: ["MMLorHTML.js"],
  jax: ["input/TeX","input/MathML","output/HTML-CSS","output/NativeMML"],
  extensions: ["tex2jax.js","mml2jax.js","MathMenu.js","MathZoom.js"],
  TeX: {
    extensions: ["AMSmath.js","AMSsymbols.js","noErrors.js","noUndefined.js"]
  }
});</script>
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/2.0-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

次に、

<script>タグを閉じた後にこの<body>を追加します

<script type="text/javascript">
  MathJax.Hub.Configured()
</script>

ドキュメント を参照してください

または

あなたはこの素晴らしい例を見ることができます.. https://math.stackexchange.com/ ..math.stackexchangeのソースを確認してください..それは本当に役に立ちます..

[〜#〜]更新[〜#〜]

この54ページを参照してください リンク ..それは言います

MathJaxはMathML3.0数学タグをサポートしていますが、いくつかの制限があります。 MathMLサポートはまだ活発に開発されているため、一部のタグはまだ実装されておらず、一部の機能は完全には開発されていませんが、間もなく開発されます。欠陥は次のとおりです。

•テーブルの配置グループはサポートされていません。

•すべての属性がテーブルでサポートされているわけではありません。たとえば、columnspanとrowspanはまだ実装されていません。

•初等数学タグの実験的サポート:mstack、mlongdiv、msgroup、msrow、mscarries、およびmscarry。 (mml3拡張機能を介して。以下を参照してください。)

•双方向数学の実験的サポート。

3
Lal
1
Robin Qiu

私のChrome拡張機能 "HTML + MathML"を試してください: https://chrome.google.com/webstore/detail/fmath-html-%2B-mathml-solut/emdjdpchbjipnjhkfljbcapgfecmnglm? hl = en-GB

または「すべてのブラウザ」の私の解決策: http://www.fmath.info/formula/js/allBrowser.jsp

よろしく

0
Ionel Alexandru

CSSの助けを借りてHTML5を使用することでChrome内にMathMLをレンダリングすることは可能であるようです。つまり、未知のタグをサポートするChromeバージョンです。

HTML5編集をテストするためにcontenteditable = "true"をいじる赤ちゃんのステップを含む実験として、私はここでこのCSSを使用していました。
https://developer.mozilla.org/en-US/docs/Mozilla/MathML_Project/test-mathml-css

CSSを使用しないChromeの例:

without CSS

CSSを使用したChromeの例:

enter image description here

ソースファイルはここにあります:
https://Gist.github.com/jburse/fb43afd01048feac7028b5642817af0a#file-mathml-html

0