1

Google Image Charts APIに対する非推奨の警告に注意して、新しいJavaScript GoogleChartsAPIを使用するためのアプリケーションのアップデートをリリースしようとしています。明らかにAndroidWebKitのバージョンに依存する軸のラベル付けでJavaScriptの問題が発生しています。Webkitクライアント内でSVGがサポートされていないため、GoogleChartsAPIの使用は3.1より前では機能しないことを認識しています。

バックグラウンド

アプリケーションは現在、Eclair（APIレベル7）をサポートしており、SVGサポートはHoneycomb MR1（APIレベル12）の組み込みWebKitクライアントでのみ提供されます。この機能の不一致に対処するために、私のコードでは、使用するチャートAPIを決定する前に、Androidのバージョンを検査する単純なif-elseステートメントを使用しています。

レンダリングの問題

これは写真で最もよく示されます。その点に注意してください;

  1. JellyBeanデバイスと同じJavaScriptがAndroidHoneycombEmulatorで実行されています。
  2. 比較は、エミュレーター（機能していない）と実際の電話（機能している）の間です
  3. JavaScriptは、組み込みの機能を利用してWebView内から実行されていますandroid.webkit.WebViewClient
  4. エミュレーターの軸は[Object object]、実際のデバイスでは正しく表示されます

軸のラベル付けの問題を示すグラフ

図1 -HoneycombEmulatorで見つかった誤った軸ラベル。

正しい軸ラベルを示すチャート

図2-実デバイスで見つかった正しい軸ラベル。

コード

「貼り付け爆撃」がない場合、無関係なコードの塊に関する問題は、垂直（v）軸の命名を駆動するJSとJavaのビットを以下に説明します。

JavaScript

...
As part of the chart options...
...
// Vertical axis.
vAxis: {title: yAxisTitle.toString(),
        baselineColor: 'white',
        titleTextStyle: {color: 'gray'},
        textStyle: {color: 'gray'}, 
        gridlines: {color: 'gray'}
        }

そのようyAxisTitleにAndroidを介して注入された場所。WebView.addJavascriptInterface

Java

chart.addJavascriptInterface(String.format(getString(string.height_label), getUnits().getSymbol()), "yAxisTitle");

これまでの調査

以前の説明に簡単に遭遇したことから[Object object]（私はJSの世界に不慣れです）、JavaScriptオブジェクトでtoStringを実行しているだけであり、そのように見えることを理解しています。しかし、これは、Android 3.1と4.1の間でJava-JavaScriptインジェクションに変更があったことを意味します。つまり、addJavascriptInterfaceを介してインジェクトされるデータ型は、以前は「記憶」されていませんでした。文字列をJSONオブジェクトにシリアル化する必要がありますか、それとも（ほぼ）プリミティブ型を渡すものに対してそれはやり過ぎですか？最後に、軸ラベルなどのアイテムに使用されているオブジェクトの種類が実際に文字列であることを強制するために、JS側で明示的にキャストする必要がありますか？感謝します。

4

1 に答える 1

1

私はコンソールを使用して、質問で説明した注入および解析アプローチWebChromeClientに関するさまざまな順列の結果をログに記録しました。私は、Androidのさまざまなバージョンでタイプが「失われる」ことはなく、キャストやその他の不正行為によって説明されている状況が修正されないことを発見しました。

アプローチの代わりにJSONObject、軸のタイトルを説明するものを挿入し、JSでオブジェクトを解析しました。下記参照;

Java

final JSONObject axes = new JSONObject();
axes.put("yAxisTitle", String.format(getString(string.height_label), getUnits().getSymbol()));
axes.put("zAxisTitle", getString(string.period_label));
chart.addJavascriptInterface(axes, "axes");

JavaScript

vAxis: {title: chartAxes.yAxisTitle,
        baselineColor: 'white',
        titleTextStyle: {color: 'gray'},
        textStyle: {color: 'gray'}, 
        gridlines: {color: 'gray'}
       },

そして、これはAndroidのバージョン間で機能します。教訓-データ型が基本的であっても、JSONなしでJava-JS通信を試みないでください-そこには大きな驚きはありません。

于 2013-02-13T23:38:44.017 に答える