पत्रक: मार्कर

Question

पर एक लिंक जोड़ें बहुत आसान सवाल: मैं नक्शा मार्करों को क्लिक करने योग्य पत्र में कैसे बना सकता हूं और उपयोगकर्ता को किसी अन्य पृष्ठ पर रूट कर सकता हूं? प्रत्येक मार्कर का अपना पृष्ठ होता है।

मैंने बिना सफलता के निम्नलिखित प्रयास किए हैं; किसी भी तरह सभी मार्कर एक ही पृष्ठ पर इंगित करते हैं, जो अंतिम असाइन किया गया यूआरआई है।

var markers = [ 
    { coords: [51.505, -0.09], uri: '/some-page' }, 
    ... 
]; 

for(x in markers) 
{ 
    L.marker(markers[x].coords).on('click', function() { 
     window.location = markers[x].uri; 
    }).addTo(map); 
} 

यह समस्या वास्तव में मुझे पागल कर रही है।

Answer 1

ठीक है, मैं अंततः एक समाधान में आया; जब मानचित्र में एक मार्कर जोड़ा जाता है तो उसे "_leaflet_id" नामक एक आईडी असाइन की जाती है। इसे लक्षित ऑब्जेक्ट के माध्यम से लाया जा सकता है, और पर के बाद कस्टम मान पर भी सेट किया जा सकता है, इसे मानचित्र में जोड़ा गया है।

तो अंतिम समाधान बस है:

var x = markers.length; 

while(x--) 
{ 
    L.marker(markers[x].coords).on('click', function(e) { 
     window.location = markers[e.target._leaflet_id].uri; 
    }).addTo(map)._leaflet_id = x; 
} 

(मैं प्रतिस्थापित के लिए-इन के साथ पाश एक उलट जबकि पाश)

Answer 2

तुम भी एक पॉपअप जो एचटीएमएल प्रदर्शित कर सकते हैं इस्तेमाल कर सकते हैं

marker.bindPopup (htmlString);

Answer 3

मुझे एक समान कोड मिला जो आपकी मदद कर सकता है। यहाँ jsfiddle लिंक http://jsfiddle.net/farhatabbas/qeJ78/

$(document).ready(function() { 
     init_map(); 
     add_marker(); 
    }); 
    var map; 

    function init_map() { 
     map = L.map('map').setView([37.8, -96], 4); 
     L.tileLayer('http://{s}.tile.cloudmade.com/{key}/22677/256/{z}/{x}/{y}.png', { 
      attribution: 'Map data © 2011 OpenStreetMap contributors, Imagery © 2012 CloudMade', 
      key: 'BC9A493B41014CAABB98F0471D759707' 
     }).addTo(map); 
    } 

    function add_marker() { 
     var points = [ 
      ["P1", 43.059908, -89.442229, "http://www.url_address_01.com/"], 
      ["P2", 43.058618, -89.442032, "http://www.url_address_02.com/"], 
      ["P3", 43.058618, -86.441726, "http://www.url_address_03.com/"] 
     ]; 
     var marker = []; 
     var i; 
     for (i = 0; i < points.length; i++) { 
      marker[i] = new L.Marker([points[i][1], points[i][2]], { 
       win_url: points[i][3] 
      }); 
      marker[i].addTo(map); 
      marker[i].on('click', onClick); 
     }; 
    } 

    function onClick(e) { 
     console.log(this.options.win_url); 
     window.open(this.options.win_url); 
    }