Dessiner un polygone sur un clic de carte en utilisant la brochure

Question

Ci-dessous mon code pour dessiner un polygone sur une carte.Utilisant ceci je peux dessiner un polygone mais sur un clic de carte, il permet de dessiner un gestionnaire et en deuxième clic je dessine un polygone .

Sortie attendue - Au premier clic Sur la carte je veux dessiner le premier point sur la carte.

map = new L.Map('map', {layers: [osm], center: new L.LatLng(-37.7772, 175.2756), zoom: 15 }); 

    var drawnItems = new L.FeatureGroup(); 
    map.addLayer(drawnItems); 

    var shapeOptions = { 
      color: '#0066FF', 
      fillColor: '#0066FF', 
      // clickable: false 
      weight: 10 
    }; 
    var opt = { 
    position: 'topright', 
    draw: { 
     polygon: { 
      allowIntersection: false, 
      drawError: { 
       color: '#FF0000', 
       message: '' 
      }, 
      repeatMode: true, 
      shapeOptions: shapeOptions 
     } 
    }, 
    edit: { 
     featureGroup: drawnItems, //REQUIRED!! 
     remove: false 
    } 
}; 

map.on('click', function(e) { 
    new L.Draw.Polygon(map).enable(); 
}); 

Answer 1

Vous commencez une nouvelle édition de polygone sur chaque cliquez sur votre carte. Vous devriez vérifier si l'utilisateur est en train de dessiner ou pas.

Pour résoudre le problème avec les deux clics (au lieu d'un), vous pouvez passer la propriété latlng de l'événement latlng à L.Draw.Polygon(map).addVertex(latlng) pour dessiner le premier sommet polygonal au premier clic.

var editing = false; 
map.on('click', function(e) { 
    if(!editing){ // do not start multiple "edit sessions" 
    editing = true; 
    var polyEdit = new L.Draw.Polygon(map); 
    polyEdit.enable(); 
    polyEdit.addVertex(e.latlng); 
    } 
}); 

map.on('draw:created', function (e) { 
    editing = false; 
    var type = e.layerType, 
     layer = e.layer; 
    drawnItems.addLayer(layer); 
}) 

Voici une démo: https://plnkr.co/edit/NCXOfUF1NAh66Wq1gWJO?p=preview