Ich muss die Breite und Höhe eines beliebigen g
Elements in meinem genau kennen, SVG
da ich einen Auswahlmarker darum zeichnen muss, sobald der Benutzer darauf geklickt hat.
Was ich im Internet gesehen habe, ist so etwas wie : d3.select("myG").style("width")
. Das Problem ist, dass für das Element nicht immer ein explizites Breitenattribut festgelegt ist. Wenn ich zum Beispiel einen Kreis innerhalb von erstelle g
, wird r
anstelle der Breite radious ( ) gesetzt. Selbst wenn ich die window.getComputedStyle
Methode für a verwende circle
, wird "auto" zurückgegeben.
Gibt es eine Möglichkeit, die Breite einer beliebigen svg
Auswahl in zu berechnen D3
?
Danke dir.
quelle
getBoundingClientRect()
anstelle von nur SVGgetBBox()
. Wie so:d3.select("body").node().getBoundingClientRect().width
Beispiel:
quelle
Einmal war ich mit dem Problem konfrontiert, als ich nicht wusste, welches Element derzeit in meiner Variablen (svg oder html) gespeichert ist, aber ich musste es Breite und Höhe erhalten. Ich habe diese Funktion erstellt und möchte sie teilen:
Kleine Demo im versteckten Ausschnitt unten. Wir behandeln das Klicken auf das blaue Div und auf den roten SVG-Kreis mit der gleichen Funktion.
Code-Snippet anzeigen
quelle