2

マップ上でLeafpileというLeafletおよびLeafleatプラグインを使用しています。基本的にはデータベースからの結果のセットであり、このマップのjavascriptコードは次のとおりです。

var cmAttr = '© 2013 OpenStreetMap',
cmUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/{styleId}/256/{z}/{x}/{y}.png';

var minimal   = L.tileLayer(cmUrl, {styleId: 1, attribution: cmAttr})

var southWest = new L.LatLng(3.8642546157214084, -199.86328125);
var northEast = new L.LatLng(73.12494524712693 , -24.08203125);
var bounds = new L.LatLngBounds(southWest, northEast);

var markers = new L.LeafpileGroup();
L.marker([40.91, -74.15]).bindPopup('The html content').addTo(markers),
L.marker([37.7, -121.90]).bindPopup('The html content').addTo(markers);

var map = L.map('map', {
    center: [34.488616,-97.8692325],
    minZoom: 4,
    scrollWheelZoom: false,
    zoom: 5,
    layers: [minimal, markers]
});


map.setMaxBounds(bounds);

私が抱えている問題は、HTML内の結果のリンクをクリックしたときに、マップ上でポップアップ（map.openPopup（popup）メソッドなど？！）を開きたいということです。

<ul id="set">
<li><a href="#">RESULT #1</a></li>
<li><a href="#">RESULT #2</a></li>
</ul>

私はすべてを試しましたが、成功しませんでした。このイベントをjQuery関数にバインドしたいのですが、次のようになります。

$(document.body).on("click",'#set a', function(e) {
    //other code that I need
});
4

1 に答える 1

1

私はstackoverflowに非常に慣れていませんが、機能し、十分に効率的であると思われるソリューションを見つけました。

最初に空の配列を作成する必要があります

var array =[]

位置配列には、すべての座標が含まれている必要があります。locationarray に、場所と対応する latlng 値を持つプロパティを持つオブジェクトを入力しました。

locationarray= [{name:"Hotel London",location:[51.5, -0.09]},{name:"Hotel Barnaby",location:[51.49, -0.088]},{name:"Hotel Rendelliare",location:[51.51, -0.12]},{name:"Hotel Francion",location:[51.52, -0.089]},{name:"Hotel Waterloo",location:[51.5, -0.11]}]

次に、vararray にマーカー オブジェクトを入力します。

for(i=0;i<locationarray.length;i++){

vararray[i] = L.marker(locationarray[i].location).addTo(map);
vararray[i].bindPopup('<div id="hotel'+i+'">' + locationarray[i].name + '</div>')

}

次に、for ループを使用して div を作成します。for ループでは、div に onclick ハンドラーまたは関数をトリガーする任意のものを割り当てます。反復処理に使用している値を関数に渡します。 

for(i=0,len = objarray.length; i<len ;i++){
$('#viewportRS').append('<div onclick="$.clicked('+i+')" class="hotels" id="'+i+'">'+ whatevervar +'</div>')}

関数は数値パラメーターを除外し、vararray のそのインデックスで openPopup() を呼び出す必要があります

$.clicked = function(id){


vararray[id].openPopup()


}

私はそれを何度もテストしましたが、うまくいきます。何か問題がある場合はお知らせください。

于 2013-06-20T18:22:39.817 に答える