전단지 다중 마커 장고지도 참조?

저는 Python 3.4, 최신 Django와 리플릿 django를 사용하고 있습니다. 맵을 표시하고 내 목록에서 마커 1 개를 추가 할 수 있습니다.전단지 다중 마커 장고지도 참조?

문제는 목록에있는 모든 마커를 추가하는 것입니다. 이 코드는 모든 마커를 렌더링하지만 일부는 맵에 추가되지 않습니다. 어쩌면 범위 문제를 통해지도 참조를 잃어 버릴 수 있습니까? 나는 잘 모르겠다. 여기에 내 코드가있다. 정말 도움을받을 수있다.

{% load leaflet_tags %} 
 

 
<head> 
 
    
 
    {% leaflet_js %} 
 
    {% leaflet_css %} 
 
</head> 
 

 
<body> 
 

 

 
{% if latest_device_list %} 
 
<script type="text/javascript"> 
 

 
    {% for device in latest_device_list %} 
 
\t \t \t function map_init_basic (map, options) { 
 
\t \t 
 
     marker = new L.marker([{{device.Device_Lat}}, {{device.Device_Lon}}]) 
 
\t \t .bindPopup("<h3>"+{{device.Device_IMEI}}+"</h3>") 
 
\t \t .addTo(map); 
 
\t \t 
 
       } 
 
    {% endfor %} 
 
\t </script> 
 
{% else %} 
 
    <p>No Devices are available.</p> 
 
{% endif %} 
 
    {% leaflet_map "yourmap" callback="window.map_init_basic" %} 
 
</body>

출처

2015-02-06 user3470096

내가 장고 정말 익숙하지 않은, 그래서 내가 잘못 할 수도 있지만 아닌 for 루프 삽입 여러 map_init_basic 방법/콜백합니까? 그래서 같은 콜백 함수를 계속해서 선언하고 있습니까? 지도 초기화시 하나만 실행됩니다. 내 생각 엔 당신이 마커 선언 주위에 콜백 함수에 for 루프를 넣어해야한다는 것입니다 :

<script type="text/javascript"> 

    function map_init_basic (map, options) { 

     {% for device in latest_device_list %} 

      marker = new L.marker([{{device.Device_Lat}}, {{device.Device_Lon}}]) 
       .bindPopup("<h3>"+{{device.Device_IMEI}}+"</h3>") 
       .addTo(map); 

     {% endfor %} 

    } 

</script>

무엇 지금 일어나고있는 것은 당신이 당신의 장치 목록에 세 개의 마커를 말할 때, 그것은 이런 식으로 끝날 것입니다 :

<script type="text/javascript"> 

    function map_init_basic (map, options) { 
     marker = new L.marker([0, 0]) 
      .bindPopup("<h3>"+ 'ABC' +"</h3>") 
      .addTo(map); 
    } 
    function map_init_basic (map, options) { 
     marker = new L.marker([1, 1]) 
      .bindPopup("<h3>"+ 'DEF' +"</h3>") 
      .addTo(map); 
    } 
    function map_init_basic (map, options) { 
     marker = new L.marker([2, 2]) 
      .bindPopup("<h3>"+ 'GHI' +"</h3>") 
      .addTo(map); 
    } 

</script>

두 번째 함수 선언은 첫 번째를 덮어 쓰고 세 번째 함수는 두 번째를 덮어 씁니다. 따라서 map_init_basic이 호출되면 세 번째 함수 만 실행됩니다.

출처

2015-02-06 20:32:31 iH8

나는 그 마커의 어느 것도 표시하지 루프에 대한 이동합니다. – user3470096

좋아, 그럼 나는 실망했다. 내가 말할 수있는 한 가지는, 다중 콜백 함수를 갖는 것이 전혀 의미가 없다는 것입니다. – iH8

당신이 옳았어요. 그냥 조금 향상 시켜야만 했어요. – user3470096

수정 코드 :

{% if latest_device_list %} 
 
<script type="text/javascript"> 
 
    function map_init_basic (map, options) { 
 
    var marker = null; 
 
    map.setView([51.505, -0.09], 13); 
 
    {% for device in latest_device_list %} 
 
     marker = new L.marker([{{device.Device_Lat}}, {{device.Device_Lon}}]) 
 
\t \t .bindPopup("<h3>"+{{device.Device_IMEI}}+"</h3>") 
 
\t \t .addTo(map); 
 
    {% endfor %} 
 
\t } 
 
\t </script> 
 
{% else %} 
 
    <p>No Devices are available.</p> 
 
{% endif %} 
 
    {% leaflet_map "yourmap" callback="window.map_init_basic" %} 
 
</body>

출처

2015-02-06 21:06:33 user3470096

전단지 다중 마커 장고지도 참조?

답변

관련 문제