Ich migriere meinen d3-Code von v3 nach v4 und habe Probleme, eine Entsprechung für die Eigenschaften d3.zoom.x, d3.zoom.y zu finden.
Hier ist ein kurzer Teil des Codes, einschließlich der wichtigsten Elemente:
%Vor%Ich habe versucht, dies zu verwenden, um "zoom.x (x); zoom.y (y [0])"
zu ersetzen %Vor%Diese skalieren jedoch nur die Achse neu und lassen die Daten nicht-zommed.
Ich kann nicht sagen, wie d3 v3 mit Zoom umgehen konnte, da ich erst vor kurzem angefangen habe, mit D3 zu arbeiten, aber der Code unten sollte dich in die richtige Richtung weisen. Ich werde mein Bestes geben, um zu beschreiben, was los ist. Ich lade Korrekturen, Verbesserungen und bessere Erklärungen ein.
Zuerst ein MCVE
Dies ist nur ein einfaches Streudiagramm mit einem roten und grünen Kreis. Sie können sehen, wie ich die Komponenten der x- und y-Achse ausgebrochen habe. Dies kommt mit d3.zoom() ins Spiel.
Als nächstes fügen wir eine Zoom-Komponente hinzu.
Hier können Sie sehen, dass das Diagramm Zoom-In, Zoom-Out und Ziehen über beide Achsen ermöglicht. Ich glaube, Sie wollen nur eine einzige Achse Zoom, also in diesem Fall, skalieren Sie nur die X-Achse und die X-Komponente der einzelnen Kreise Position.
Ein letzter Ausschnitt, der macht, was ich denke, Sie wollen.
Tags und Links javascript d3.js zooming d3v4