代码之家  ›  专栏  ›  技术社区  ›  ShinkenDT

传单geojson更新可拖动状态或标记

  •  0
  • ShinkenDT  · 技术社区  · 7 年前

    我想知道是否有可能更新传单中GEOJSON层内标记的可拖动事件,我知道我可以通过添加以下内容来做到这一点:

    layer.options.draggable = True
    

    在onEachFeature函数中,我试图实现的是在元素单击时更新可拖动选项,类似于:

    $(document).on('click','#someButton',function(){
        layer.options.draggable = True; //Only one specific marker
    });
    

    这样,我希望禁用所有具有可拖动选项的标记,然后单击按钮,仅为一个特定标记启用可拖动选项。是否可以使用geojson层来实现这一点?我在featureGroup中也有这个geojson层,希望你们能帮助我。谢谢

    2 回复  |  直到 7 年前
        1
  •  1
  •   Community Neeleshkumar S    4 年前

    每一个 L.Marker 有一个 dragging 属性,它是标记的 Handler 对于拖动,传单处理程序可以是 enable() d和 disable() d

    这个 Leaflet documentation about L.Marker 's dragging property 还明确指出:

    交互处理程序是标记实例的属性,允许您在运行时控制交互行为,启用或禁用某些功能,如拖动(请参阅 处理程序 方法)。例子:

    marker.dragging.disable();
    

    在您的具体情况下,这意味着:

    $(document).on('click','#someButton',function(){
        layer.dragging.enable();
    });
    

    请注意,这仅适用于 五十、 标记器 s-如果您使用的是GeoJSON,不要期望它对直线或多边形或您特别决定显示为的点起作用 L.Circle s或 L.CircleMarker s(通过 pointToLayer 选项 L.GeoJSON )

        2
  •  0
  •   ghybs    7 年前

    只需将传单标记从地图中移除,设置(重置)其 draggable 选项,然后将其重新添加到地图:

    var map = L.map('map').setView([48.86, 2.35], 11);
    
    var marker = L.marker([48.86, 2.35]).addTo(map);
    
    document.getElementById('dragonoff').addEventListener('click', function(event) {
      event.preventDefault();
    
      // Toggle Marker draggability.
      marker.remove();
      marker.options.draggable = !marker.options.draggable;
      marker.addTo(map);
    
      alert(marker.options.draggable ? 'Marker is now draggable' : 'Marker is no longer draggable');
    });
    
    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
      attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
    }).addTo(map);
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css">
    <script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet-src.js"></script>
    
    <div id="map" style="height: 150px"></div>
    
    <button id="dragonoff">Enable / Disable dragging</button>

    是否通过GeoJSON传单图层组创建标记无关紧要。