Ist es möglich, eine Schicht, die aus mehreren Objekten besteht, in einem Faltblatt ziehbar zu machen?

Question

Ich möchte eine Gruppe von Objekten gleichzeitig ziehbar machen, so dass sie nur zusammen gezogen werden können. Das bedeutet: Wenn ich ein Objekt verschiebe, werden die anderen Objekte in der Ebene verschoben. Insbesondere habe ich eine Geojson-Datei mit einer FeatureCollection, die aus mehreren Objekten besteht und ich möchte, dass sie ziehbar sind, sich aber wie ein einzelner Marker auf der Karte verhalten.

Bisher habe ich:

var mymap = L.map('mapid').setView... 
... 

var drag = L.geoJson(null,{ 
    draggable: true, 
}); 

omnivore.geojson('data.geojson', null, drag).addTo(mymap) 

I Leaflet.Path.Drag enthalten sind, die GeoJSON Objekte ziehbar zu machen.

Im Ergebnis kann jedes Feature in der Geojson Feature Collection unabhängig voneinander gezogen werden. Wie kann ich sie verbinden?

Answer 1

Ich löste es schließlich, indem ich d3 den schleppenden Teil behandle. Wählen Sie das Gruppenelement aus, nachdem es zur Karte hinzugefügt wurde, und verwenden Sie es über d3.drag().

var d = [{ x: 0, y: 0 }]; 
d3.select('svg').select('g').data(d) 
    .attr("transform", function (d) { 
     return "translate(" + d.x + "," + d.y + ")"; }) 
    .call(onDragDrop(dragmove, dropHandler)); 

function onDragDrop(dragHandler, dropHandler) { 
    var drag = d3.drag(); 

    drag.on("drag", dragHandler) 
     .on("end", dropHandler); 
    return drag; 
} 

function dropHandler(d) { 
    alert('dropped'); 
} 

function dragmove(d) { 
     d.x += d3.event.dx; 
     d.y += d3.event.dy; 
     d3.select(this) 
      .attr("transform", "translate(" + d.x + "," + d.y + ")"); 
}