Wie kann ich die Projektion eines vorhandenen D3-Pfades finden?

Question

Ich verwende D3, um eine Vektorkarte zu berechnen, die auf einem GeoJSON-Datensatz basiert.

Ich habe einen vorhandenen Pfad und ich muss den Pfad mithilfe eines Tweens transformieren. Um dies zu tun, muss ich D3 verwenden, um das aktuelle projection Objekt für diesen Pfad zu suchen. Allerdings kann ich nicht die Syntax herausfinden, um dies zu erreichen. Ist es möglich, die Projektion eines bestehenden D3-Pfades nachzuschlagen?

ich nachschlagen kann den Weg mit:

const mapPath = d3.select('path.states'); 

Aber ich bin nicht sicher, wo von dort aus zu gehen, um das Projektionsobjekt von diesem Weg zu bekommen. Vielen Dank für Ihre Hilfe oder Anleitung.

Answer 1

Da (nach der Diskussion in den Kommentaren) klingt es wie der Code, der eine Projektion verwendet, um die Karte in der gleichen App lebt wie der Code, der diese Projektion an anderer Stelle in der App benötigt, dann ist dies wirklich eine Frage von App-Architektur - nicht Projektionserkennung. Es gibt sicherlich Möglichkeiten, es so zu gestalten, dass die Projektion an die Subroutine "weitergegeben" wird, die es braucht, aber das hängt wirklich von den Frameworks und Ihrer Implementierung usw. ab.

Also ohne in die Architektur zu kommen, ein anderer Weg Tun Sie dies und folgen Sie Marks Vorschlag (und tatsächlich durch das Code-Snippet in Ihrer ursprünglichen Frage angegeben), indem Sie die Datenbindung von d3 verwenden, um die Projektion vom DOM-Knoten abzuhängen, den die Projektion hervorgebracht hat. IMO ist im Vergleich zu einer App-Architektur-Lösung, die Datenbindung für diesen Zweck verwendet, die geringere Option, weil es Ihren Code schwerer machen könnte, Bug Bugs zu folgen. Aber es wird funktionieren und zumindest in einer einfachen App ist es vernünftig, es so zu machen. So ...

Vermutlich irgendwo haben Sie Code, der erstellt und gerendert die Wege, und es könnte wie folgt aussehen:

var projection = d3.geo.mercator(); 
var mapG = svg.append('g').attr('class', 'map'); 
var mapG.selectAll('path').data(myMapData).enter() 
    .append('path') 
    .attr("d", d3.geo.path().projection(projection)); 

Ich bin sicher, dass Ihr anders aussieht, aber hoffentlich ist es in der Nähe der oben, weil ich darauf hinweisen muss, dass die N Pfade sind, die N Einträgen in entsprechen, und dass jedem Pfad bereits ein Datum zugeordnet ist (das Datum des Geo-Features, das es darstellt). Also ein guter Ort, um Ihre Projektion hängt nicht auf den Pfaden (weil es Vielfache gibt, und sie haben Daten bereits an sie gebunden), sondern auf dem Eltern der Pfade - mapG in diesem Fall. Die Art und Weise Sie es tun wird .datum() mit der Projektion auf die DOM-Knoten zu binden:

mapG.datum(projection); 

nun von diesem anderen Stelle im Code, in dem Sie die Projektion nachschlagen müssen, dann würden Sie datum() verwenden um es zu extrahieren:

var mapG = d3.select('svg g.map') 
var projection = mapG.datum()