Leafletで大きなデータセットを視覚化する


35

Leafletを使用して大規模なデータセット(10,000ポイントの機能を備えたGeoJSON)を視覚化する場合、当然のことながらブラウザーがクラッシュまたはハングします。同じデータセットからの1000個のフィーチャのサブサンプルは問題なく機能します。残念ながら、他の人が試してみるためにデータセットを共有することはできません。

このような大規模なデータセットを視覚化するための優れたソリューションはありますか?(最終的な目的は、これを200万個の機能に拡張することです)Polymapsd3.jsなどのブラウザーベースの代替が不可能であると見なされる場合に備えて、オフラインの視覚化フレームワークを検討しても構いません。

編集:言及するのを忘れましたが、ユーザーは属性によってデータセットをフィルターできる必要があります。したがって、N個の機能のうち、一致するn <= N個の機能のみを動的にレンダリングする必要がある場合があります。


3
同様の議論:gis.stackexchange.com/questions/4096/ gis.stackexchange.com/questions/14882 gis.stackexchange.com/questions/6954
julien

回答:


23

私はリーフレットの著者です。このための素晴らしいクラスタリングプラグインLeaflet.markerclusterがあります。非常に高速かつ効率的で(50kマーカーの例を見てください)、見栄えが良く、素晴らしいアニメーションで非常にスムーズに動作し、ニーズに合った多くのオプションがあります。


3
また、PruneCluster有望に見えます。
TLama

1
元の質問を拡大したいと思います。次のようなことをする必要があります:matall.in/posts/deep-insights-visualizing-1m-flight-routes マーカーの代わりにパスをクラスター化するにはどうすればよいですか?
ギルレルメグ

16

TileMillを使用し、ポイントをラスターイメージとしてレンダリングし、UTFGridからの高速な対話機能を使用できます。この国勢調査マップのように、特定のエリアに必要なデータのみを必要なときに正確に送信するため、数百万のポイントとポリゴンにスケーリングされます。

私の知る限り、非常に高速なWFSサーバーを持つ以外にこれを行うための高速な方法はありません。

開示:MapBoxでの作業、かなりの量のコードを記述しました。しかし、TileMillは無料/オープンソースなどです。


1
ユーザーがデータセットを属性でフィルタリングし、一致するレコードのみを表示できる必要があることを忘れていました。したがって、10,000件のレコードのうち、特定のケースで実際にレンダリングする必要があるのは500件だけだとしましょう。TileMillでこれを実行できますか(またはどのように実行しますか)?
イマド

3
いや。CartoDBを試してみたいと思うかもしれませんが、物事を動的にし、物事を性能的にすることは目標に反することを知っておく必要があります。
tmcw

1
国勢調査マップのリンクは無効です!
drho

すべてのリンクが停止されています。
リージー

9

リーフレットクラスター化ツールを調べましたか?著者によるブログ投稿でここに説明されてい ます

一見の価値がある別のオプションは、GIS Cloudと組み合わせてリーフレットを使用することです。見てください、このデモそれは非常に迅速にジオメトリの多くを扱う見ること。非常に印象的。GISCloudとは一切関係ありません。


7

地図上に何百万ものポイントを表示しないでください。主要なパフォーマンスの問題だけでなく、ユーザーの観点からも、このデータを解釈することは非常に難しいため、ユーザーの観点からです。データを集約するいくつかの手段(クラスタリング、ポリゴンエリアへの集約など)を異なるズームレベルで異なる表示タイプと組み合わせて使用​​します(たとえば、非常に高いズームレベルでのみ「生」ポイントデータを表示し、他の場所で集約データを使用します)。例としては、zillow.comなどの不動産サイトがあります。


8
「絶対にすべきではない」と言ってはいけません。Locals&Touristsは、数百万(この場合は数十億)のポイントを視覚化することができる洞察の良い例です。
ジョセフシーディー

1
@velotronに同意します。たとえば、600万ポイントを美しくすばやくレンダリングします:mapbox.com/blog/supercluster
マックスフォンヒッペル

1
ええ、しかしこの場合、それらのポイントも(ズームレベルに応じて)クラスター化され、データの解釈と理解が非常に簡単になります。
chriserik

2
@chriserik正しいので、正しい答えは、「それほど多くのポイントがある場合、クラスタリングまたはヒートマップを使用する必要があり、ここにそれを行う方法があります...」
Max von Hippel

3
私のポイントは、数百万点のクラスター化されていないプロットが洞察を提供できるということでした。
ジョセフシーディー

0

レンダリングされるポイントフィーチャの量を減らすことをお勧めします。人間の目では、2,000,000ではなく10,000ポイントを見ることができません。

試すことができるのは、カスタムサーバーからデータセットを動的に要求することです(セットアップする必要があります)。

    map = ...
    map.on('moveend', function(e) {
        getGeoJson(e);
    });
    map.on('zoomend', function(e) {
        getGeoJson(e);
    });
    map.setView([2,3], 2);

    function getGeoJson(event) {
        // todo determine current viewport
        $http.get('someGeoJsonDataProvider.someLanguage?currentView=[lat0,lon0,lat1,lon1]').then(function (resp) {
            // todo clear layers
            // new layer
            map.addLayer(
                L.geoJson(resp.data)
            );
        });
    }

サーバーは、ユーザーが今見たいものに応じて、どのポイントを返すかを計算します。ズーム率とクリッピングに応じて、ユーザーエクスペリエンスを悪化させることなく、ごくわずかなポイントを返すだけで済みます。

欠点:サーバーのセットアップ(ジオポイントをフィルター処理するためのライブラリを見つける必要があります)および遅いレンダリング(ズームまたはドラッグのたびにサーバーリクエストを行う必要があります)


-5

5000〜1億件のレコードをマップするソリューションがありました。サーバー側のソリューションを使用してグリッドベースとダイナミックベースを行う必要があります。クライアント側のレンダリングを行うために、WebマップAPI(Googleなど)で返信することはできません。

[http://96.231.36.9:8080/rbgis/google_map.html][1]上記のリンクを試して、その方法を確認してください


2
サーバーにアクセスできない場合でも役立つように、回答を展開してください。
lynxlynxlynx

ええ、それは皮肉です。サーバー側のリンクが機能しないため。
マックスフォンヒッペル
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.