Muszę dokładnie znać szerokość i wysokość dowolnego g
elementu w moim, SVG
ponieważ po kliknięciu go przez użytkownika muszę narysować wokół niego znacznik wyboru.
Co widziałem w Internecie jest coś takiego: d3.select("myG").style("width")
. Problem polega na tym, że element nie zawsze będzie miał wyraźnie ustawiony atrybut szerokości. Na przykład, kiedy utworzę okrąg wewnątrz g
, będzie on miał ustawioną radious ( r
) zamiast szerokości. Nawet jeśli użyję window.getComputedStyle
metody na a circle
, zwróci ona „auto”.
Czy istnieje sposób, aby obliczyć szerokość dowolnego svg
elementu w D3
?
Dziękuję Ci.
javascript
d3.js
André Pena
źródło
źródło
getBoundingClientRect()
zamiast pliku tylko SVGgetBBox()
. Tak jak to:d3.select("body").node().getBoundingClientRect().width
Przykład:
źródło
Kiedyś napotkałem problem, kiedy nie wiedziałem, który element jest obecnie przechowywany w mojej zmiennej (svg lub html), ale potrzebowałem uzyskać szerokość i wysokość. Stworzyłem tę funkcję i chcę ją udostępnić:
Małe demo w ukrytym fragmencie poniżej. Obsługujemy kliknięcie niebieskiego div i czerwonego koła svg z tą samą funkcją.
Pokaż fragment kodu
źródło