Comment faire pour faire glisser un polygone de la même manière que l'exemple de déplacement d'un point mapbox-gl-js?

Question

J'ai un polygone geojson ajoutant à la carte sur le clic d'un bouton. J'ai également le style du polygone changeant sur l'événement mousedown sur les paires de coordonnées geojson et x/y (la géométrie geojson) imprimant à la console accédant par l'intermédiaire de l'appel de queryRenderedFeatures sur l'API. Je veux maintenant rendre le polygone draggable comme l'exemple de point (liens ci-dessous) sur l'événement mousedown sur le polygone et être capable de le déplacer sur la carte, en mettant à jour les coordonnées x/y des nœuds de polygone dans le polygone événement mousedown, mais en gardant la taille de geojson intacte tout au long de la traînée.

Est-ce que la méthode mapbox-gl-js est correcte ou dois-je alimenter un polygone geojson préconfiguré en mapbox-gl-draw - draw polygon mode à l'action d'un utilisateur?

Des suggestions ou des exemples?

API Drag A Point Example

Drag A Point GitHub Code

Answer 1

En utilisant mapbox-gl-draw fonctionne très bien pour cela. Vous trouverez ci-dessous un exemple d'utilisation d'un geojson dans un polygone de dessin, qui est prêt pour la mobilité sur votre carte.

var draw = new MapboxDraw({ 
     displayControlsDefault: false, 
     controls: { 
      polygon: true, 
      trash: true 
     } 
     }); 
     map.addControl(draw, 'bottom-right'); 
     // ADD THE GEOJSON POLYGON AS A DRAW FEATURE 
     var featureIds = draw.add(polygonFeature); 
     console.log(featureIds);