6

私は Ajax で Bing Maps を使用しており、プッシュピンをドロップする場所が約 80,000 あります。この機能の目的は、ユーザーがルイジアナ州のレストランを検索し、画鋲をクリックして健康検査情報を表示できるようにすることです。

明らかに、一度に 80,000 個のピンをマップに表示してもあまり効果がありませんが、この問題の最善の解決策を見つけるのに苦労しています。もう 1 つの問題は、これらの場所の間の距離が非常に短いことです (80,000 か所すべてがルイジアナにあります)。クラスタリングを使用してマップが乱雑にならないようにできることはわかっていますが、それでもパフォーマンスの問題が発生するようです。

私が現在やろうとしているのは、特定のズームレベルまでピンを表示せず、現在のビュー内にのみピンを表示することです。私が現在試みている方法は、viewchangeend イベントを使用してズーム レベルとマップの境界を見つけ、その範囲内の任意のポイントについて (Web サービスを介して) データベースにクエリを実行することです。

私はこれについて間違った方法で進んでいるように感じます。この大量のデータを管理するためのより良い方法はありますか? 最初にすべてのポイントをロードしてから、マップが移動するたびに Web サービスにアクセスせずにデータを手元に置いておく方がよいでしょうか。もしそうなら、どうすればいいですか?

質問に対する答えを見つけることができませんでした。これは通常、間違った質問をしていることを意味します。誰かが私が正しい質問を理解するのを手伝ってくれたら、それは大歓迎です.

4

2 に答える 2

9

さて、私はこれに対して少し異なるアプローチを実装しました。楽しい練習でしたが、HTML5 キャンバスを使用して Bing Maps にすべてのデータ (約 140.000 ポイント) を表示しています。

以前にすべてのデータをクライアントにロードしました。次に、描画プロセスを大幅に最適化して、「Viewchange」イベント (ビュー変更プロセス中に常に発生するイベント) に関連付けました。

私はこれについてブログを書きました。ここで確認できます。

私の例には相互作用がありませんが、簡単に実行できます (ブログ投稿の良いトピックになるはずです)。したがって、イベントを手動で処理し、対応するポイントを自分で検索するか、描画するポイントの量やズーム レベルがしきい値を下回っている場合は、通常の画鋲を表示する必要があります。


とにかく、Bing Maps に制限されていない場合の別のオプションは、Leafletなどを使用することです。タイルベースのレイヤーであるが、HTML5 キャンバスを使用してクライアント側でレンダリングされるキャンバス レイヤーを作成できます。可能性の新しい範囲を開きます。たとえば、 GisCloudでこのマップを確認してください。


さらに別のオプションは、静的データにより適していますが、UTFGrid と呼ばれる手法を使用することです。それを開発した若者は確かに私よりもうまく説明できますが、驚異的なパフォーマンスで必要なだけ多くのポイントに対応できます. これは、情報を含むタイル レイヤーと、タイルの機能を説明する "ascii-art" ファイルのようなものを含む json ファイルで構成されます。次に、 waxと呼ばれるライブラリを使用して、パフォーマンスにまったく影響を与えることなく、完全なマウス オーバー、マウス クリック イベントを提供します。

私もそれについてブログを書きました。

于 2012-04-19T21:41:04.703 に答える
3

クラスタリングを使いこなせるなら、クラスタリングが最善の策だと思います。クラスタリングを使用しようとしたが、それでもパフォーマンスの問題が発生したとおっしゃいましたか? V7 Interactive SDKで 80000 データ ポイントを使用してテストを行ったところ、問題なく動作するようです。Load module - clusteringリンクに移動してタブの行を変更して、自分でテストしてください。

TestDataGenerator.GenerateData(100,dataCallback);

TestDataGenerator.GenerateData(80000,dataCallback);

ボタンを押しRunます。多くのデータポイントで、パフォーマンスは許容できるようです。

于 2012-04-19T18:49:38.323 に答える