0

WebView を介して Android でjqPlotを使用しようとしていますが、エラーのない空白の WebView が表示されます。アプリのアセット ディレクトリから単純な HTML ファイルを WebView に読み込んでから、必要な JavaScript を実行してグラフを作成しようとしています。任意の支援/提案をいただければ幸いです!

WebView をロードするコードは次のとおりです。

private View getSimpleChartView() {
    View chartView = getLayoutInflater().inflate(R.layout.test_chart, null);

    TextView chartTitle = (TextView) chartView.findViewById(R.id.txtChartTitle);
    chartTitle.setText("Simple Chart");

    WebView webView = (WebView) chartView.findViewById(R.id.webView);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.setWebViewClient(new ChartWebViewClient());
    webView.loadUrl("file:///android_asset/jqplot_template.html");
    webView.loadUrl("javascript:" + getJqPlotJavascript());

    return chartView;
}

private String getJqPlotJavascript() {
    StringBuilder js = new StringBuilder();

    js.append("<script language=\"javascript\" type=\"text/javascript\" src=\"file:///android_asset/jqplot/jquery.min.js\"></script>\n");
    js.append("<script language=\"javascript\" type=\"text/javascript\" src=\"file:///android_asset/jqplot/jquery.jqplot.min.js\"></script>\n");
    js.append("<link rel=\"stylesheet\" type=\"text/css\" href=\"file:///android_asset/jqplot/jquery.jqplot.css\" />\n");
    js.append("<script type=\"text/javascript\">");
    js.append("$.jqplot('chartdiv',  [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]]);\n");
    js.append("</script>");

    return js.toString();
}

jqplot_template.html

<html>
    <body>
        <div id="chartdiv" style="height:400px;width:300px;"></div>
    </body>
</html>
4

2 に答える 2

1
  1. jqplot スクリプトと css 参照を HTML に配置します。
  2. Jayesh のアドバイスに従い、javascript onPageFinished を呼び出します (そして、webView を final としてマークします)。
  3. 含まれているスクリプト タグを JavaScript 文字列から削除します
  4. ブーム！

HTML

<html>
     <script language="javascript" type="text/javascript" src="file:///android_asset/jqplot/jquery.min.js"></script>
     <script language="javascript" type="text/javascript" src="file:///android_asset/jqplot/jquery.jqplot.min.js"></script>
     <link rel="stylesheet" type="text/css" href="file:///android_asset/jqplot/jquery.jqplot.css" />
    <body>
        <div id="chartdiv" style="height:400px;width:300px;"></div>
    </body>
</html>

ジャワ

private View getSimpleChartView() {
    View chartView = getLayoutInflater().inflate(R.layout.test_chart, null);

    TextView chartTitle = (TextView) chartView.findViewById(R.id.txtChartTitle);
    chartTitle.setText("Simple Chart");

    final WebView webView = (WebView) chartView.findViewById(R.id.webView);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.setWebViewClient(new WebViewClient(){
        @Override
        public void onPageFinished(WebView view, String url) {
            webView.loadUrl("javascript:" + getJqPlotJavascript());
            super.onPageFinished(view, url);
        }
    });
    webView.loadUrl("file:///android_asset/jqplot_template.html");

    return chartView;
}

private String getJqPlotJavascript() {
    StringBuilder js = new StringBuilder();
    // Just this line
    js.append("$.jqplot('chartdiv',  [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]]);\n");
    return js.toString();
}
于 2013-09-12T17:19:47.800 に答える
0

それを使用して webview を webView.loadUrl("file:///android_asset/jqplot_template.html"); ロードすると、ページのロードに時間がかかります。

ページが正しくロードされていない可能性があるため、javascript 関数をすぐに呼び出すことはできません。

代わりにこれを行います：

webView.setWebViewClient(new WebViewClient(){`
    @Override
    public void onPageFinished(WebView view, String url) {
        webView.loadUrl("javascript:" + getJqPlotJavascript());

        super.onPageFinished(view, url);
    }
});

これが役立つことを願っています。

于 2013-06-19T16:51:59.630 に答える