在Web视图中渲染包含数学方程式的HTML数据

时间:2019-01-03 14:38:25

标签: android android-webview mathjax

我想在Webview中显示HTML数据,其中还包含使用MathJax的数学方程式,但是在我的应用程序中,我无法呈现数学方程式

我尝试使用下面的代码

    webView.getSettings().setJavaScriptEnabled(true);
    webView.getSettings().setBuiltInZoomControls(true);
    webView.getSettings().setLoadWithOverviewMode(true);
    webView.loadDataWithBaseURL("http://bar/", "<script type='text/x- mathjax-config'>"
            + "MathJax.Hub.Config({ "
            + "showMathMenu: false, "
            + "jax: ['input/MathML','output/HTML-CSS'], " // output/SVG
            + "extensions: ['mml2jax.js'], "
            + "TeX: { extensions: ['noErrors.js','noUndefined.js'] }, "
            //+"'SVG' : { blacker: 30, "
            // +"styles: { path: { 'shape-rendering': 'crispEdges' } } } "
            + "});</script>"
            + "<script type='text/javascript' "
            + "src='file:///android_asset/MathJax/MathJax.js'"
            +"<script type= 'text/javascript' "
            +"src=http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"
            + "></script><span id='text'> </span> <span id='math'></span>", "text/html", "utf-8", "");


    String htmlFilename = "test.html";
    AssetManager mgr = getBaseContext().getAssets();
    try {
        InputStream in = mgr.open(htmlFilename, AssetManager.ACCESS_BUFFER);
        String htmlContentInStringFormat = StreamToString(in);
        in.close();
        if (android.os.Build.VERSION.SDK_INT < 19) {
            webView.loadUrl("javascript:document.getElementById('math').innerHTML='"
                                    + "<math xmlns=\"http://www.w3.org/1998/Math/MathML\">"
                                    + "<mstyle displaystyle=\"true\">"
                                    + doubleEscapeTeX(htmlContentInStringFormat)
                                    + "</mstyle></math>';");
            webView.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
        } else {
            webView.evaluateJavascript("javascript:document.getElementById('math').innerHTML='<font color=\"#000000\">`" + doubleEscapeTeX(htmlContentInStringFormat) + "`</font>';", null);
            webView.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
        }
    } catch (Exception e) {

    }

我正在从资产加载HTMl文件,但未渲染

test.html     

Euclid的除法引理指出,对于带有c> d的正整数 c d ,存在唯一的整数 q r 满足条件c = dq + r使得0≤r

让任何正整数是 c 和d = 3。

现在,根据Euclid算法c = 3q + r,对于其他q≥0的整数。

所有剩余的可能值为0、1、2,因为它满足0≤r<3的条件。现在, c 的可能值为3q或3q + 1或3q + 2。

情况1:如果c = 3q。

c 3 =(3q)3 = 27 q 3 = 9(9 q 3)= 9m

情况2:如果c = 3q + 1。

c 3 =(3q + 1)3 = 27 q 3 +27 q 2 + 9q + 1 = 9(3 q 3 +3 q 2 + q)+1 = 9m + 1

情况2:如果c = 3q + 2。

c 3 =(3q + 2)3 = 27 q 3 +54 q 2 + 36q + 8 = 9(3 q 3 +6 q 2 + 4q)+8 = 9m + 8

因此,任何正整数的立方体的形式均为9m,9m + 1或9m + 8。

1 个答案:

答案 0 :(得分:0)

我看到MathJax用于解释MathML语言。

所以我建议您使用GeckoView而不是WebView。

GeckoView具有支持MathML的版本

https://wiki.mozilla.org/Mobile/GeckoView

我发布了一段代码,向您展示如何访问html子目录中的资产文件。

唯一的问题是您增加了APK的重量(+ 30Mo)。

enter image description here

enter image description here

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    GeckoView view = findViewById(R.id.geckoview);
    GeckoSession session = new GeckoSession();
    GeckoRuntime runtime = GeckoRuntime.create(this);

    session.open(runtime);
    view.setSession(session);

    session.loadUri("resource://android/assets/html/myMathMLFile.html");
}