2

I need to integrate MATHJAX into my android webview to parse mathml data coming through API in json format. I took reference from this: https://github.com/leathrum/android-apps.

When I wrote this code:

public void fillWebView(final WebView w, final String yourHtml) {
    w.getSettings().setJavaScriptEnabled(true);
    w.getSettings().setBuiltInZoomControls(true);
    w.loadDataWithBaseURL("http://bar", "<script type='text/x-mathjax-config'>"
            + "MathJax.Hub.Config({ "
            + "showMathMenu: false, "
            + "jax: ['input/TeX','output/HTML-CSS'], "
            + "extensions: ['tex2jax.js'], "
            + "TeX: { extensions: ['AMSmath.js','AMSsymbols.js',"
            + "'noErrors.js','noUndefined.js'] } "
            + "});</script>"
            + "<script type='text/javascript' "
            + "src='file:///android_asset/MathJax/MathJax.js'"
            + "></script><span id='math'></span>", "text/html", "utf-8", "");
    w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
            + doubleEscapeTeX(yourHtml)
            + "\\\\]';");
    w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
}

private String doubleEscapeTeX(String s) {
    String t = "";
    for (int i = 0; i < s.length(); i++) {
        if (s.charAt(i) == '\'') t += '\\';
        if (s.charAt(i) != '\n') t += s.charAt(i);
        if (s.charAt(i) == '\\') t += "\\";
    }
    return t;
}

I got error like this:

[INFO:CONSOLE(1)] "Uncaught TypeError: Cannot set property 'innerHTML' of null", source:  (1)

04-21 19:57:05.449 26698-26698/com.myclasscampus I/chromium: [INFO:CONSOLE(1)] "Uncaught ReferenceError: MathJax is not defined", source:  (1)

I tried this solution into it: WebView code generating Uncaught TypeError and Uncaught ReferenceError errors on Android 4.4.2 (API 19) emulator ....

So my New code is like this:

public void fillWebView(final WebView w, final String yourHtml) {
w.getSettings().setJavaScriptEnabled(true);
w.getSettings().setBuiltInZoomControls(true);
w.loadDataWithBaseURL("http://bar/", "<script type='text/x-mathjax-config'>"
        + "MathJax.Hub.Config({ "
        + "showMathMenu: false, "
        + "jax: ['input/TeX','output/HTML-CSS'], "
        + "extensions: ['tex2jax.js'], "
        + "TeX: { extensions: ['AMSmath.js','AMSsymbols.js',"
        + "'noErrors.js','noUndefined.js'] } "
        + "});</script>"
        + "<script type='text/javascript' "
        + "src='file:///android_asset/MathJax/MathJax.js'"
        + "></script><span id='math'></span>", "text/html", "utf-8", "");


w.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);

        if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){
            loadUrlKitKat(w,doubleEscapeTeX(yourHtml));
        }
        else{
            w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
                    + doubleEscapeTeX(yourHtml)
                    + "\\\\]';");
            w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
        }





    }
});




}

@TargetApi(Build.VERSION_CODES.KITKAT)
private void loadUrlKitKat(WebView w,String param){
w.evaluateJavascript("javascript:document.getElementById('math').innerHTML='<font color=\"#97FD97\">`"+param+"`</font>';",null);
     w.evaluateJavascript("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);",null);
}

private String doubleEscapeTeX(String s) {
String t = "";
for (int i = 0; i < s.length(); i++) {
    if (s.charAt(i) == '\'') t += '\\';
    if (s.charAt(i) != '\n') t += s.charAt(i);
    if (s.charAt(i) == '\\') t += "\\";
}
return t;
}

So now I am getting this error:

[INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token ILLEGAL", source:  (1)

NOTE: I am not passing anyweb url in my web-view. My web view is defined in XML and i need to parse mathml data coming through APIs. (as a json object).

Guide me how to solve this.

Community
  • 1
  • 1

0 Answers0