2016-05-20 4 views
0

私は、次のプロパティを持っている私のマップ上のカスタムコントロールを持っている:リーフレットの場合、同じ位置に2つのコントロールがある場合、どのようにコントロールを注文するのですか?

position: "topright" 

これはデフォルトのレイヤーコントロールと同じ位置にそれを置きます。しかし、私のカスタムコントロールはの上に置かれ、レイヤーコントロールはです。どちらを上にするべきかを指定するにはどうすればよいですか? control positionsのドキュメントには、複数の場所が同じ場所にある場合の対処方法は記載されていません。

マイマップは、次のように初期化されます。

L.Control.Cluster = L.Control.extend({ 
    options: { 
    position: "topright", 
    }, 

    onAdd: function (map) { 
    var clusterName = "leaflet-control-cluster" 
     , container = L.DomUtil.create("div", clusterName + " leaflet-bar") 
     , options = this.options 

    this._map = map 

    var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control leaflet-control-custom'); 
    container.style.backgroundColor = 'white'; 
    container.style.backgroundImage = "url(image.png)"; 
    container.style.backgroundRepeat = "no-repeat"; 
    container.style.backgroundPosition = "center"; 
    container.style.backgroundSize = "25px 25px"; 
    container.style.width = '36px'; 
    container.style.height = '36px'; 

    return container 
    } 
}) 

:ボタン自体が `オナ

にこれは、このように私の右上を設定し、このように設定されて

var map = L.map('map', { 
    center: [0.0, 0.0], 
    zoom: 2 
}); 

map.addControl(new L.Control.Cluster()) 

これは私の右上をこのように設定します:

Top Right example

カスタムコントロールをレイヤーコントロールの下に表示するにはどうすればよいですか?

答えて

2

これはコントロールの作成順序と関係があります。 これは、レイヤ制御した後、カスタムコントロールを追加します。

L.control.layers(baseLayers, overlays).addTo(map); 

map.addControl(new L.Control.Cluster()); 

http://plnkr.co/edit/3VipBSvsQWsiQa5hfBCD?p=preview

関連する問題