2017-05-15 1 views
0

LeafletJSを使用している間にポップアップを2番目のマーカにバインドすることはできません。ここに私のjavascriptのコードです:LeafletJSは、ポップアップを2番目のマーカにバインドできません。

 var map = L.map('mapScene', { 
       zoomControl: false, 
     attributionControl: false, 
    }).fitWorld(); 

    var playerIcon = L.icon({ 
     iconUrl: 'img/playermarker.png', 
     shadowUrl: 'img/marker-shadow.png', 

     iconSize: [25, 41], 
     iconAnchor: [12, 41], 
     popupAnchor: [1, -34], 
     shadowSize: [41, 41] 
    }); 

     var itemsIcon = L.icon({ 
     iconUrl: 'img/crate.png', 
     shadowUrl: 'img/marker-shadow.png', 

     iconSize:  [45, 46], // size of the icon 
     shadowSize: [50, 64], // size of the shadow 
     iconAnchor: [22, 94], // point of the icon which will correspond to marker's location 
     shadowAnchor: [10, 117], // the same for the shadow 
      popupAnchor: [1, -34], 
    }); 



    L.tileLayer('http://stamen-tiles-{s}.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.{ext}', { 
     minZoom: 14, 
     maxZoom: 14, 
     attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> &mdash; Map data &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>', 
     subdomains: 'abcd', 
     ext: 'png' 
    }).addTo(map); 


    var playerMarker; 

    function onLocationFound(e) { 
     var radius = e.accuracy/2; 


     playerMarker = L.marker(e.latlng, { 
      icon: playerIcon 
     }).addTo(map).bindPopup("Hey i'm you!"); 

       addMarkers(); 
    } 

     function addMarkers(){ 
      alert(); 

      L.marker(playerMarker + 2, { 
        icon: itemsIcon 
      }).addTo(map).bindPopup("").on('popupopen', function() { 
      alert(); 
      }); 
     } 


    function onLocationError(e) { 
     alert(e.message); 
    } 

    map.on('locationfound', onLocationFound); 
    map.on('locationerror', onLocationError); 

    map.locate({ 
     setView: true, 
     maxZoom: 16 
    }); 

第2のマーカーは、ショーのアップは完全に罰金機能「()addMarkers」を通じて追加しましたが、全く機能していません.bindpopup。マーカーをクリックすることはできますが、何も表示されず、警告も表示されません。

+1

'L.marker(playerMarker + 2、...は'私には奇妙であるあなたも、あなたがしてやろうとしているか説明してもらえます。あなたのマーカー?なぜ、あなたは 'locationfound'イベントに2つのマーカーを追加する必要がありますか? –

+0

@JulienVプレイヤーのマーカーの近くにマーカーを追加するだけで問題には関係ありませんが – Hexdro

+0

@JulienV – ghybs

答えて

2

フィドルのための@ghybsありがとうございます。ここにはworking fiddleがあります。 playerMarker + 2latLngとして扱うことができたとは思えませんでしたが、間違いだったようです。マーカーと整数の間の加算は機能しません。

[EDIT】ここで、コードの興味深い作品です:

function onLocationFound(e) { 
    var radius = e.accuracy/2; 
    playerMarker = L.marker(e.latlng).addTo(map).bindPopup("Hey i'm the first marker "); 

    addMarkers(); 
} 

function addMarkers() { 
    //alert(); 
    var ll = playerMarker.getLatLng(); 
    var ll2 = L.latLng(ll.lat+12, ll.lng+12); 
    var mm = L.marker(ll2).addTo(map); 
    mm.bindPopup("Hey i'm the second marker"); 
} 
関連する問題