我想在 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)
您似乎正在加载 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']);
相反。