외부 링크를 사용하여 drupal의 전단지에 팝업 창을 엽니 다

Question

자, 여기 내 상황이 있습니다. Drupal과 함께 리플렛 맵 모듈을 사용하고 있습니다. 내 웹 사이트에보기가 통합 된지도가 있습니다. 팝업 창을 통해 표시 할 내용이 포함 된 노드가 있습니다. 각 개별 마커를 클릭하면 팝업이 원하는대로 정확하게 작동합니다. 그러나 외부 링크를 클릭하여 팝업을 열 수 있기를 원합니다. 이 질문을 다른 질문에서보고 구현했습니다 : 사용자 abenrob에 의해

var markers = []; 
var marker1 = L.marker([51.497, -0.09],{title:"marker_1"}).addTo(map).bindPopup("Marker 1"); 
markers.push(marker1); 
var marker2 = L.marker([51.495, -0.083],{title:"marker_2"}).addTo(map).bindPopup("Marker 2"); 
markers.push(marker2); 
var marker3 = L.marker([51.49, -0.097],{title:"marker_3"}).addTo(map).bindPopup("Marker 3"); 
markers.push(marker3); 

function markerFunction(id){ 
    for (var i in markers){ 
     var markerID = markers[i].options.title; 
     if (markerID == id){ 
      markers[i].openPopup(); 
     }; 
    } 
} 

$("a").click(function(){ 
    markerFunction($(this)[0].id); 
}); 

으로 표시되었지만 drupal에서 생성 된 마커에서는 작동하지 않습니다.

제 질문은 두 부분으로되어 있습니다.

1 : 내 다른 블록 내의지도에 어떻게 액세스합니까? 앞서 언급 한 코드가 포함 된 함수를 호출하기 위해 메뉴 블록에서 링크를 설정하고 올바르게 호출합니다. 그러나, 나의 자바 스크립트가지도에 말할 필요가있을 때, 나는 아무것도 얻지 않는다. 현재 나는 "var map = document.getElementById ('leaflet-map');"을 가지고 있지만 div가 아닌 div를 가져 오는 것으로 보인다.

2 : drupal에서지도에서 생성 한 마커 목록에 어떻게 액세스합니까? 현재, 테스트로, 나는 마커를 수동으로 생성하고 bindPopup 함수를 사용하여 페이지에 팝업이 포함 된 div를 바인딩하지만 맵에 추가 할 수는 없습니다 (파트 1 참조). 이상적으로 나는 드루팔 (Drupal에서 이미 생성 된 경우 자바 스크립트에서 마커를 다시 만들고 싶지 않지만 우리는 항상 이상적인 세상에 살지는 않습니다. 그러나 연결 맵을 얻는다면 적어도 그 작업을 할 수 있습니다. .

Answer 1

누군가 다른 사람이 같은 질문으로이 문제를 우연히 만난다면, 나는 첫 번째 질문을 알아 냈습니다. 다음 코드를 활용하여 Drupal에서 만든 전단지를 리플릿 모듈을 통해 액세스했습니다.

// This accesses the leaflet map created by drupal and sets the map variables so that they can be used with the functions 

var map; 

$(document).bind('leaflet.map', function(e, settingsLeaflet, lMap) 
{ 
    map = lMap; 
}); 

나는 두 번째 질문을 계속하고 있습니다. 알아 내면 또 다른 업데이트를 추가 할 것입니다.

편집 : 같은, 그것은 마커 목록을 반복 한 쉬웠다 거기에서

var markers = {}; 
var markersList = []; 

// This accesses the leaflet map features and pulls the marker variables so that they can be used with the functions 
$(document).bind('leaflet.feature', function(e, lFeature, feature) 
{ 
markers[feature.feature_id] = lFeature; 
markersList.push(lFeature); 
}); 

: 나는 다음과 같은 코드를 사용하여 두 번째 질문에 마커에 액세스 할 수 있었다

// This function takes the variable id, which is passed from the HTML call of this function. It then loops through the marker list and compares the id with the value of the title of each marker. If it finds a match, then it opens the popup bound to that specific marker. 
function markerPopups(id) 
{ 

    // Loops through the markers list 
    for (var i = 0; i < markersList.length; i++) 
    { 
     // Sets a variable to get the title of the marker, which 
     var markerID = markersList[i].options.title.replace(/[^a-zA-Z0-9]/g, '_'); 

     // Compares the variable passed through the function to the title of the marker. If there is a match, it opens the popup for that marker. 
     if(markerID == id) 
     { 
      markersList[i].openPopup(); 
     } 
    } 
} 

또한 미리 만들어진 마커에 액세스하면지도에 액세스 할 필요가 없으므로지도를 다른 용도로 사용할 필요가 없다면 첫 번째 부분을 무시할 수 있습니다.