외부 웹 사이트의지도 상자 아이콘에 연결 하시겠습니까?

약 7 개의 마커가있는지도 상자지도가 포함 된 페이지가 있습니다. 각 마커에는 탐색 도구 모음에 추가 된 축소판이 포함되어 있으며 해당 축소판을 클릭하면 표식으로 이동하여 열립니다.외부 웹 사이트의지도 상자 아이콘에 연결 하시겠습니까?

외부 웹 사이트에 비슷한 링크를 포함하고 싶습니다. 나를지도 박스 페이지로 이동시켜 특정 마커를 여는 외부 웹 페이지에 링크가있을 수 있습니까?

//populate markers 
oneArtPlease.on('layeradd', function(e) { 
    var marker = e.layer, 
    feature = marker.feature; 

    // popupz 
    var popupContent = '<div class="thumbnail"><a target="_blank" class="popup" href="' + feature.properties.url + '">' + 
     '<img src="' + feature.properties.image + '" width="300" title="Click for the full picture" /><br>' + 
     feature.geometry.coordinates+'</br>'+ 
     feature.properties.picnote + 
     '</a></div>'; 
    marker.bindPopup(popupContent,{ 
     closeButton: true, 
     minWidth: 320 
    }); 

    //change icon 
    marker.setIcon(L.icon(feature.properties.icon)); 
    //populate thumbnail bar 
    var link = info.insertBefore(document.createElement('a'),info.firstChild); 
    link.className = 'item'; 
    link.href = '#'; 
    link.innerHTML ='<img src="' + feature.properties.image + '" class="navthumb"/>'; 
    link.onclick = function() { 
     if (/active/.test(this.className)) { 
      this.className = this.className.replace(/active/, '').replace(/\s\s*$/, ''); 
     } else { 
      var siblings = info.getElementsByTagName('a'); 
      for (var i = 0; i < siblings.length; i++) { 
       siblings[i].className = siblings[i].className 
       .replace(/active/, '').replace(/\s\s*$/, ''); 
      }; 
      this.className += ' active'; 
      // move to marker and open on thumbnail click 
      map.panTo(marker.getLatLng()); 
      marker.openPopup(); 
     } 
     return false; 
    }; 

}); 
new L.Control.Zoom({ position: 'topright' }).addTo(map);

출처

2014-10-12 neelshiv

좋은 질문입니다. 나는 당신이 요구하는 것을 정확하게하는 방법을 확신하지 못하지만, [mapbox의 새로운 정적지도] (https://www.mapbox.com/developers/api/static/)가 당신을 도울 수 있습니까? – dkniffin

URL 매개 변수를 js로 구문 분석하는 코드가 있습니다. 여기서 url 매개 변수는 index.html을 사용하는 패스입니다. piece = X

function getURLParameter(name) { 
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null 
} 

pieceID = getURLParameter('piece');

나중에 마커를 채울 때 다음 코드를 실행합니다.

if (marker.feature.properties.pieceID == pieceID) { 
    map.panTo(marker.getLatLng()); 
    marker.openPopup(); 
}

또한 geojson 파일의 각 마커에 대해 pieceID라는 속성을 포함합니다. URL이 조각 매개 변수 X와 함께 전달되고 마커의 조각 ID가 X 인 경우 페이지가로드 될 때 표시됩니다.

출처

2014-10-16 14:13:45 neelshiv

외부 웹 사이트의지도 상자 아이콘에 연결 하시겠습니까?

답변

관련 문제