แผ่นพับ: เปิดป๊อปอัปอัตโนมัติในแต่ละเครื่องหมาย

ฉันกำลังติดตาม SnakeIn ของ IvanSanchez เพื่อวาดเครื่องหมายแต่ละตัว หลังจากแต่ละเส้น

รหัสได้รับการแก้ไขเช่น

   var markers = [[63.5, 11],
    [40.5, -3.5],
    [51.5, -0.5],
    [52.3, 4.75],
    [39.5, -0.5]];

   var route = L.featureGroup().addTo(map);

   var n = markers.length;

   for (var i = 0; i < n-1; i++) {
        var marker = new L.Marker(markers[i]);
        var line = new L.polyline([markers[i],markers[i+1]]);
        route.addLayer(marker);
        route.addLayer(line);
    };
   route.addLayer(new L.Marker(markers[n-1]));

   map.fitBounds(route.getBounds());

ฉันพยายามเล่นกับ ป๊อปอัป Leaflet ซึ่งฉันสามารถผูกป๊อปอัปสำหรับเครื่องหมายแต่ละตัวได้ คำถามของฉันคือ ฉันจะทำให้แต่ละป๊อปอัปเปิดโดยอัตโนมัติเมื่อมีการวาดเครื่องหมายได้อย่างไร แล้วป๊อปอัปจะปิดโดยอัตโนมัติเมื่อมีการวาดเครื่องหมายถัดไป และอื่นๆ...


person Tenz    schedule 12.10.2016    source แหล่งที่มา


คำตอบ (1)


ใน Leaflet ทุกเลเยอร์ (รวมถึงเครื่องหมาย) มี add เหตุการณ์ ซึ่ง จะเริ่มทำงานเมื่อมีการเพิ่มลงในแผนที่

ภายใน โค้ดสำหรับ Leaflet.Polyline.SnakeAnim จะลบและเพิ่มเลเยอร์จาก LayerGroup เมื่อแอนิเมชันงูทำงาน ซึ่งหมายความว่าเลเยอร์ที่กำลังเข้ามาจะทำให้เกิดเหตุการณ์ add

นอกจากนี้ LayerGroup (หรือ FeatureGroup) ที่รันแอนิเมชั่นงูจะทำให้เกิดเหตุการณ์ snake ทุกครั้งที่มีเลเยอร์ใหม่เข้ามา อย่างไรก็ตาม โปรดทราบว่าเหตุการณ์นี้ไม่มีการอ้างอิงถึงเลเยอร์ที่เพิ่งเข้ามา

ดังนั้นบางอย่างเช่น:

marker1.on('add', function(){
    // Open popup for marker 1
});

คุณยังพูดว่า:

จากนั้นจะปิดโดยอัตโนมัติเมื่อมีการวาดเครื่องหมายถัดไป

ขั้นแรกให้อ่านเอกสารสำหรับ L.Map.openPopup จากนั้น:

marker1.on('add', function(){
    map.openPopup( popupForMarker1 );
});
person IvanSanchez    schedule 12.10.2016
comment
--- ‹br/› var marker = new L.Marker(loc, {icon: allIcon}); marker.on('เพิ่ม', function(){ map.openPopup(เนื้อหาของฉัน); }); var line = ใหม่ L.polyline([loc, nextLoc]); เส้นทาง addLayer (เครื่องหมาย); เส้นทาง addLayer (บรรทัด); ‹br/› --- ดูเหมือนว่าจะไม่ได้เพิ่มเครื่องหมายอื่นใด แต่มีเพียงเครื่องหมายแรกเท่านั้นที่เพิ่มแล้วจึงติดอยู่ตรงนั้น ไม่มีป๊อปอัปปรากฏขึ้นด้วย - person Tenz; 12.10.2016
comment
คุณช่วยยกตัวอย่างได้ไหม? มันไม่ได้ผลสำหรับฉันจริงๆ และฟังก์ชัน SnakeIn ก็หยุดทำงาน - person Tenz; 12.10.2016
comment
มันใช้งานไม่ได้จริงๆ ฉันพยายามอย่างที่คุณบอกแล้ว ไม่มีป๊อปอัปแสดงเมื่อมีการวาดเครื่องหมายแต่ละตัวบนงูในฟังก์ชัน - person Tenz; 13.10.2016