如何通過傳單中的標記傳遞數據js

我在我的項目中使用傳單js和openstreetmap。
我在地圖上的相同位置有多個圈標。
我想在圈標記中存儲一些標識，以便我可以識別在單擊圈標時應該引用哪些數據。如何通過傳單中的標記傳遞數據js

我circlemarker是

var myMarker = L.circleMarker(myPoint, { title: 'unselected', radius: 20 }); 
myMarker.addTo(map);

這裏我使用的其他用途，這就是爲什麼我不能使用它的標題。
任何人都可以告訴我一些方法來做到這一點。

來源

2013-07-02 vaibhav shah

這聽起來像你想添加新的功能（功能，屬性等）到一個現有的類。爲此使用面向對象的委託人是有道理的。爲此，我建議您擴展CircleMarker類以添加這些屬性。現在

customCircleMarker = L.CircleMarker.extend({ 
    options: { 
     someCustomProperty: 'Custom data!', 
     anotherCustomProperty: 'More data!' 
    } 
});

當您創建環形標誌，創建擴展對象的實例來代替。

var myMarker = new customCircleMarker(myPoint, { 
    title: 'unselected', 
    radius: 20, 
    someCustomProperty: 'Adding custom data to this marker!', 
    anotherCustomProperty: 'More custom data to this marker!' 
}); 
myMarker.addTo(map);

現在，您可以像標記中的任何其他選項一樣獲得屬性。這只是擴展的一個簡單情況，並且您可以根據需要執行更多操作，例如向對象添加其他屬性或函數。

的jsfiddle例如：JSFiddle

來源

2013-07-02 11:21:31

我試圖做到這一點。 var customCircleMarker = L.circleMarker。延伸（{0}選項：{StudentName：''， } }）; var myMarker = new customCircleMarker（myPoint，{title：'unselected'，radius：20，StudentName：students [k] .Name}）; // myMarker.on（'click'，selectMarker）; myMarker.addTo（map）;那麼它不會在地圖上添加標記 –

對不起。錯字。 'L.CircleMarker.extend'。 'CircleMarker'中的'C'必須大寫。還添加了一個JSFiddle到我的答案。 –

它工作得很好。謝謝 –

剛剛完成的圖片，創建一個處理程序，將鼠標點擊響應一個標記，並提供訪問新選項

function onMarkerClick(e) { 
    console.log("You clicked the marker " + e.target.options.someCustomProperty); 
    console.log("You clicked the marker " + e.target.options.anotherCustomProperty); 
} 
marker.on('click', onMarkerClick);

來源

2014-12-01 21:32:28 geegee

這適用於我的常規瀏覽器，但在Android Chrome和Firefox上，什麼都沒有出現。 onMarkerClick需要e，但e是什麼？ – MarsAndBack

好的，這個作品： function onEachFeature（feature，layer）layer.on（'click'，function（e）{onMarkerClick（e）; }）; } – MarsAndBack

與當前版本小葉（0.8-dev的），你只需設置標記對象本身的自定義屬性，而無需創建一個自定義標記類...

function map() { 
    return L.map('leaflet-canvas', 
    { 
     maxZoom: 10, 
     minZoom: 0, 
     crs: L.CRS.Simple 
    }); 
} 

var map = map().setView([0, 0], 10).on('click', onMapClick); 

function onMapClick(e) { 
    var marker = L.circleMarker(e.latlng, {draggable:true}); 

    marker.myCustomID = Math.floor((Math.random() * 100) + 1); 

    marker.on('click', onMarkerClick); 

    map.addLayer(marker); 

    // 'click' the new marker to show the ID when marker created 
    marker.fireEvent('click'); 
} 

function onMarkerClick(e) { 
    alert(e.target.myCustomID); 
}

來源

2015-02-22 22:47:36 Stackman

感謝這很容易 –

這是迄今爲止最簡單的選擇。 –

標記基本上是JavaScript對象儀式。

下面的代碼片段簡單地解決我的情況。

var marker = new L.marker([13.0102, 80.2157]).addTo(mymap).on('mouseover', onClick); 
    marker.key = "marker-1"; 

    var marker2 =new L.marker([13.0101, 80.2157]).addTo(mymap).on('mouseover', onClick); 
    marker2.key = "marker-2"; 

    function onClick(e) { 
    alert(this.key); // i can expect my keys here 
}

來源

2017-04-19 12:10:03

我會建議在您的數據結構標準GeoJSON格式導出，使其成爲直接保存爲shape文件兼容的標記等

var myMarker = L.circleMarker(myPoint, { title: 'unselected', radius: 20 }); 
myMarker.properties.id = your_Id; 
myMarker.addTo(map);

要檢索存儲的信息和做事情與它或將它傳遞給你的程序的其他部分，顯示出一個樣品的onclick功能：

myMarker.on('click',markerOnClick); 
function markerOnClick(e) { 
    my_ID = e.layer.properties.id; 
    console.log(my_ID, e.latlng); 
    // do whatever you want with my_ID 
}

我花了一段時間才能找出e.layer.properties WA y訪問點擊標記的屬性，所以希望這可以幫助某人。大多數其他例子只關注產生標記的經緯度，e.latlng。請注意，即使使用整個圖層/標記組，也可以使用相同的代碼。該功能將適用於每個單獨的標記。

來源

2018-02-25 16:59:26 nikhilvj

如何通過傳單中的標記傳遞數據js

回答

相關問題