2016-07-21 3 views
0

リーフレットマップのクリックイベントに問題があります。リーフレットマップのクリックイベントは、レイヤーコントロールがマップ要素から移動したときに表示されません。

私はこのようなマップ要素のうち、レイヤー・コントロールを移動:

document.getElementById('outside-controls').appendChild(ctrl.getContainer()); 

その後、私はレイヤー・コントロールの設定を変更するたびに、イベントをクリック欠場し始めました。

var dom_documentClicks = document.getElementById('document-clicks'), 
    dom_mapClicks = document.getElementById('map-clicks'), 
    count_documentClicks = 0, 
    count_mapClicks = 0; 

var osmUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png', 
    osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors', 
    osm = L.tileLayer(osmUrl, { 
     maxZoom: 18, 
     attribution: osmAttrib 
    }), 
    poly = L.polygon([]), 
    ctrl = L.control.layers({}, {'Polygon Layer': poly}, {collapsed: false}); 

// initialize the map on the "map" div with a given center and zoom 
var map = L.map('map', {layers: [osm, poly]}).setView([61.497752, 23.760954], 12); 

ctrl.addTo(map); 

// This seems to be the reason why click-event is not emitted. 
document.getElementById('outside-controls').appendChild(ctrl.getContainer()); 


function onDocumentClick(e) { 
    count_documentClicks++; 
    dom_documentClicks.innerHTML = count_documentClicks; 
} 

function onMapClick(e) { 
    count_mapClicks++; 
    dom_mapClicks.innerHTML = count_mapClicks; 
} 

map.on('click', onMapClick); 
document.addEventListener('click', onDocumentClick); 

そしてjsFiddleへのリンク:この問題(?バグ)を取り除くための方法を知っているhttp://jsfiddle.net/LnzN2/135/

誰でもここで

は、サンプルコードを働いていますか?

答えて

1

ctrl.getContainer()は、次のclickイベントをmapから消費するdivを返します。

この変更:これに

ctrl.getContainer() 

ctrl.getContainer().childNodes[0] 

それが動作を!

関連する問題