0

クライアント側の画像マップを使用した画像である円グラフを作成しました。画像マップは最初はページで定義されていますが、JavaScript DOM操作を介して座標が更新され、何か便利なことが行われます。画像マップ座標でのDOM操作が一部のブラウザでのみ有効であるのに、他のブラウザは変更を無視しているように見えるのはなぜですか?簡単な理由と修正はありますか?円グラフは右下にあります:http://catza.net/en/browseall/

これをWindows7でテストしましたが、Chrome 15.0(WebKit)、Firefox 7.0(Gecko)、Safari 5.1(WebKit)で動作します。これらのブラウザは、検索エンジンへのセクターの正しいドリルダウンリンクと、マウスポインタが円の上にあるときのタイトルを表示します。Internet Explorer 8(Trident)とOpera 11.52(Presto)は、初期座標に固執しているようです。この限定されたテストに基づいて、画像マップ座標のDOM更新は、GeckoとWebkitで機能しますが、TridentとPrestoでは機能しません。より多くのテスト結果を歓迎します。

実装に関する背景情報は次のとおりです。http://catza.net/en/browseall/のページソースには、画像タグ<img id="viz_dist"と地図タグが表示<map name="map_dist">されます。地図には他にもすべての準備ができていますが、まだ不明なため正しい座標ではありません。グラフと正しい地図座標はGoogleImageCharts APIによって提供されます。更新コードhttp://catza.net/js_site/dist.jsは$(document).readyでアクティブになり、DOMに受信したJSONデータを処理します。これはcoords属性に影響します。 JQuery属性を使用します。ソースコードのリセットは、Googleコードで確認できます:http ://code.google.com/p/catz/

利用可能な回避策がたくさんあることを私は知っています。サーバーに座標をロードして、ページの作成時に正しく設定することができました。しかし、それは私がグーグルから座標を受け取る前にページを送ることができないことを意味します。新しいGoogleChartToolsを使用することもできますが、私のテストでは、特にGoogle Image Charts APIを使用した低速のワークステーションで、ページのレンダリングが高速になることが示されています。JavaScriptを使用してimgタグとmapタグの両方を動的にDOMに作成することもできますが、サーバー上に完全なページを作成します。

4

1 に答える 1

0

私は解決策を見つけました。問題は、一部のブラウザでのみ機能する画像マップ座標のDOM更新に関するものではありませんでした。

元のサーバーからではなく、GoogleからJSONをフェッチしようとして、同一生成元ポリシーに違反していました。次に、JQueryの$.getJSONIEで一定の解析エラーを発生させていることに気付きました。JSONデータを作成して元のサーバーを通過させた後、テキストとして送信し、$。ajaxで受信し、$。parseJSONで解析した、画像マップ座標の更新がすべてのブラウザーで機能し始めました。

于 2011-10-31T23:11:12.200 に答える