MathJax 渲染在 Android 中无法正常工作

问题描述 投票:0回答:1

我想在 WebView 中使用 MathJax-3.2.2 渲染一些 MathJax 代码。所以我为此编写了一些代码:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_latex);

    webView = findViewById(R.id.webView);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.setWebViewClient(new android.webkit.WebViewClient());
    //webView.loadUrl("https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML");

    //initial loading the page
    webView.loadUrl("file:///android_asset/latex_page.html");

    btn = findViewById(R.id.btn);
    btn.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            String latex = "$$(-b+sqrt(-b^2-4ac)) / (2a)$$";
            String escapedExpression = escapeLatex(latex);
            String javascript = "javascript:MathJax.Hub.Queue(['Typeset', MathJax.Hub, 'output']);" +
                    "document.getElementById('output').innerHTML = '\\(" + escapedExpression + "\\)';";
            webView.loadUrl(javascript);


        }
    });

}

当 Button 按下新的 MathJax 代码时,应该在最后显示,但不幸的是,初始渲染很好,但当我尝试更新 WebView 时,它什么也没显示。

任何人都可以帮助更改 onClick() 方法,以便它能够正确呈现。

latex_page.html 就像

<html>

<head>
    <script type="text/javascript" src="file:///android_asset/es5/tex-mml-chtml.js"></script>
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
            jax: ["input/TeX", "output/CommonHTML"],
            tex2jax: {
                inlineMath: [['$', '$'], ['\\(', '\\)']],
                displayMath: [['$$', '$$'], ['\\[', '\\]']],
                processEscapes: true
            },
            CommonHTML: { linebreaks: { automatic: true } },
            displayAlign: 'center',
            displayIndent: '0'
        });
    </script>
</head>

<body>
    <p> This LaTex cod load during create activity $$ax^2+bx+c=0$$</p>
    <p>New LaTex render should show below:</p>
    <div id="output"></div>
</body>

错误:

I/chromium:[INFO:CONSOLE(1)]“未捕获的类型错误:无法读取未定义的属性‘队列’”,来源:file:///android_asset/latex_page.html(1)

java android mathjax
1个回答
0
投票

您似乎正在加载 MathJax 版本 3 (

file:///android_asset/es5/tex-mml-chtml.js
),但正在使用版本 2 调用 (
MathJax.Hub
)。这两个版本使用非常不同的 API。请参阅文档以获取升级到版本 3 的帮助。

而不是

MathJax.Hub.Queue(['Typeset', MathJax.Hub, 'output']);
,尝试

MathJax.typesetPromise(['#output']);

相反。

© www.soinside.com 2019 - 2024. All rights reserved.