プロジェクト内のマップ

インターネットユーザーとインターネットプロジェクトのオーディエンスの増加は、ジオサービスを新しいレベルに引き上げます。

以前は、「マップ」を使用するほとんどのプロジェクトは数十および数百のポイントで動作していましたが、現在では数十万のポイントについて話しています。

この記事では、ジオサービスのいくつかのユーザーケースと、Google API 3および新しいyandex API 2にそれらを実装する方法について説明します。





最大100ポイントを表示します。



最も一般的なユーザーケースは、地図上に会社のオフィスの住所を表示することです。 通常-数十個まで。

実装は最も単純な「ボックス化」されたものです。 私たちはそれにこだわらないでしょう。 yandexとgoogleの両方が、開発者またはユーザーに過負荷をかけることなく、このタスクの素晴らしい仕事をします。



数百から千から二千まで。



実装方法は、ポイントの密度に依存します。



ユースケース1:狭いトピックに関する参考書(「モスクワのすべての銀行」など)など


たとえば、「モスクワのすべての銀行」を2000ポイント(条件付き)で取得すると、密度は非常に高くなります。 ほぼすべての2000ポイントが、平均ズームの1つのビューポートに表示されます。 この場合、クラスタリングポイントが役立ちます。 Googleには、クラスタリング用の無料ライブラリ(MarkerClustererなど)がいくつかあり、新しいYandex APIでは、クラスタリングはAPIに統合されており、数行のコードで簡単に接続できます。 また、Yandex APIでは、クラスターのデフォルトビューは議論の余地のある問題かもしれませんが、ほとんどすべての設定が可能です。

この実装方法の主なマイナス(プラス)は、すべてのデータを同時にロードする必要があることです。 ここから、マップをダウンロードすることを期待しているユーザーは苦しみますが、管理者はサーバーの負荷を見て喜んでいます。

クライアントではポイントフィルタリングも簡単です。



ユースケース2:広いエリアに分布するポイント


ポイントが広い領域(たとえば、「ロシアのスポーツマスターショップ」)に分散している場合、都市を選択したメニューを作成するか、都市をプロットした別のマップ(インタラクティブではない)を作成するのが論理的です。 都市をクリックして、タグ付きの既にインタラクティブなマップを表示します。 このアプローチを使用したクラスタリングは不要な場合があります。特定の最小ズームに達したときに都市選択メニューを呼び出すズーム変更イベントにリスナーを掛けるだけです。

非常に多くのポイントがあるため、どちらのAPIも大きなブレーキなしで問題なく処理できます。 Googleのプラス機能には、コントラストの低いマップが含まれており、マーカーがより見やすくなります。 Yandexプラスには、より正確な(噂された)マップと、ロシアでレンダリングされた多数の都市が含まれます。

Google API 3とYandex Api 2はどちらもキャンバスを使用します。つまり、クライアントにラベルを直接描画します(ただし、Yandexの場合はこれを具体的に含める必要があります)。



今、心の歯痛について-すなわち。 膨大な数のDOM要素(および各ポイントに対して3〜4個のオブジェクト)。 オブジェクトの数が2000〜3000に達すると、ブラウザが強制終了されます。

唯一可能な松葉杖はFlashCanvasです。 すなわち、非常に良い結果が得られましたが、それでも「ジャム」なしではできませんでした。



多くの多くのポイント



それを実装するにはいくつかの方法があります。



方法1


クラスタリングサービスを使用します。例: v2.maptimize.com

高価で、ugく、そして確かに-私たちの方法ではありません。



方法2


独自のタイル描画サーバーを作成します。

PostGIS + Tirex + Mapnik2 + Mod_tile + Nginxを使用します

すべてが非常に高速ですが、いくつかの重要な制限があります。

1.アップデート。 ポイントを追加/削除するとき、多くの写真を再描画する必要があります。 通常、これは古いイメージをキャッシュから削除することで実現され、マップのこのセクションを最初に表示することに決めた幸せなユーザーは、欠落しているタイルの描画を待っています。 Xeon Quad-Coreでは、200ポイントで毎秒最大100タイルを描画できました。 したがって、更新頻度が低い場合は、すべて問題ありません。

2.フィルタリングできない。

はい、複数のタイルセットを描画できます。 しかし、いずれの場合でも、N個のカテゴリーの数を使用すると、

a)Nセットのタイルを作成する必要があります

b)複数のカテゴリを一度に表示することはできません(理論的には、複数のレイヤーを作成することは可能ですが、相互に影が重なり合ってロード時間が長くなるため、ひどく判明します)。

結論:この方法は、フィルタリングの可能性のない同じデータのセットに適しています。 たとえば、「ロシア郵便のすべての支店」。



方法3


その場でタイルを描きます。

このメソッドの意味は、頻繁に使用されるタイルのセット(フィルタリングなし、メインカテゴリによるフィルタリングあり)をキャッシュに保持することです。 複雑なフィルター(たとえば、Sberbank ATM + VTB ATM)をその場で描画します。 この場合、マークのサイズを少なくとも5x5に設定して、マップ全体にマークを散在させることができます。 ここでクラスタリングは不要になっています。

この方法には、少しのプログラミングと多くの鉄が必要です。 つまり、高いハードウェアコストでのバグが少なく、安定性が優れています。 1つの「グラフィック」サーバーは、100〜200の同時接続に対応できます。



方法4


別の方法があります-結合-1つの地域/都市で多く(最大10,000)を表示できます。 次の記事で彼についてお話します。



All Articles