So i try to achieve a result as on foursquare: https://foursquare.com/explore?cat=drinks&mode=url&near=Paris which is when you clik on a marker on the map, it scrol
var MarkerIcon = L.Icon.extend({
options: {
customId: "",
shadowUrl: 'leaf-shadow.png',
iconSize: [64, 64],
shadowSize: [50, 64],
iconAnchor: [22, 94],
shadowAnchor: [4, 62],
popupAnchor: [-3, -76]
}
});
var greenIcon = new MarkerIcon({iconUrl: "/resources/images/marker-green.png"}),
redIcon = new MarkerIcon({iconUrl: "/resources/images/marker-red.png"}),
orangeIcon = new MarkerIcon({iconUrl: "/resources/images/marker-orange.png"});
var mymap = L.map('mapid').setView([55.7522200, 37.6155600], 13);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
maxZoom: 18,
id: 'mapbox.streets'
}).addTo(mymap);
// добавить маркер
L.marker([55.7522200, 37.6155600], {customId:"010000006148", icon: greenIcon, title:setMarkerTitle("010000006148")}).addTo(mymap).on('click', markerOnClick);
L.marker([55.7622200, 37.6155600], {customId:"010053166625", icon: redIcon, title: setMarkerTitle("010053166625")}).addTo(mymap).on('click', markerOnClick);
function markerOnClick(e) {
var customId = this.options.customId;
document.location.href = "/view/abonents/" + customId;
}
function setMarkerTitle(customId){
var result = customId;
result += "\nline2 ";
result += "\nline3 ";
return result;
}