現在、 Leafletライブラリを使用したマップの視覚化に取り組んでいます。また、markerclusterプラグインを使用してポイントをクラスター化しています。
したがって、私の質問は次のとおりです。
3 つの異なるレイヤーに 3 つの異なるカテゴリのマーカーがあります。たとえば、レストラン、カフェ、バーのレイヤー。そして、すべてのアクティブなレイヤーを特定のクラスターに結合したいと考えています。
現時点では、エントリは個別にクラスター化されていますが、それらをまとめてクラスター化したいと考えています。
次のステップは、childMarkers に従ってクラスターを色付けすることです。たとえば、クラスターにはレストランとバーのマーカーが含まれます => 半分赤/半分緑、レストランのみ => 赤のみなど。
誰かが解決策を見つけるのを手伝ってくれることを願っています。ありがとうございました！
あなたの質問には2つの異なるリクエストがあります：
ポイント 1に関しては、明らかに 3 種類のマーカーすべてを同じ MarkerClusterGroup に追加して、クラスター化できるようにすることができます。それらが異なる LayerGroups 内に既にある場合は、簡単に行うことができmyMCG.addLayers([layerGroup1, layerGroup2, layerGroup3]);、MCG はすべての個々のマーカーを追加します。ただし、これらの LayerGroups を後でマップに追加/マップから削除することは控えてください。
難しいのは、マップから特定のタイプのマーカーを動的に追加/削除できるようにしたい場合です。を実行する代わりに、すべての個々のマーカーをループして MCG からmap.removeLayer(layerGroupX);削除する必要があります。次に例を示します。
layerGroupX.eachLayer(function (marker) {
myMCG.removeLayer(marker);
});
理由と追加の例については、MarkerClusterGroup プラグイン サイトのこの問題も参照してください。逆の手順でマーカーを MCG に追加します。
編集:それ以来、この正確なユースケースに対処するLeaflet.FeatureGroup.SubGroupプラグインを公開しました。複数のマーカー クラスタ グループを使用すると、重複するクラスタが表示されるも参照してください。
ポイント 2については、プラグイン ドキュメントの「クラスタ化されたマーカーのカスタマイズ」セクションを参照してください。基本的に、iconCreateFunctionMCG を初期化するときにオプションを使用します。引数を 1 つ取る関数を渡します (例: cluster)。これを使用cluster.getAllChildMarkers();して、スタイル設定されているクラスターに含まれるマーカーの配列を取得できます。次に、この配列を反復処理して各タイプのマーカーの数を数え、それに応じてアイコンを作成します。
この他のプラグインを試すこともできます: q-cluster。しかし、それはアニメーション化されていないため、MCG よりもはるかに魅力的ではありません…</p>