Calcular la altura vertical de un texto SVG

Tengo una matriz de cadenas. Decir,Calcular la altura vertical de un texto SVG

['Jan 11','Feb 11']

Y yo estoy creando un texto vertical con estos cadena como así

<text x="60" y="154" text-anchor="middle" style="text-anchor: middle; font: normal normal normal 12px/normal Helvetica, Arial; " font="12px Helvetica, Arial" stroke="none" fill="#ffffff" transform="rotate(90 59.75 150)"> 
<tspan>Jan 11</tspan> 
</text>

Después de la SVG se ha prestado me parece que la altura del texto es 36 píxeles. Ahora, ¿hay alguna manera de calcular la altura de un texto que se representará de antemano dado el tamaño de fuente?

Fuente

2011-10-13 Scaraffe

Puede usar el método getBBox para calcular las dimensiones de los nodos SVG.

var textNode = document.getElementsByTagName('text'), 
    bbox = textNode.getBBox(); 

//bbox now have x, y, width and height properties

Fuente

2011-10-13 13:27:33 bjornd

Sí. Pero eso es después de que el nodo ha sido renderizado. Estaba buscando una forma de calcular la altura antes de renderizar usando solo la cadena de matriz. – Scaraffe

Puede agregar el nodo con 'visibility =" hidden "' especificado, luego llamar a getBox y luego mostrarlo cuando haya realizado los ajustes que necesita. Como svg no usa el modelo de caja CSS, no afecta el diseño de otros elementos svg. Es bueno hacerlo así porque algunas propiedades en el elemento de texto pueden depender del contexto (elementos principales, estilos en cascada, etc.). –

Llamando a getBox() en nodos ocultos con lanzar una excepción en Firefox – sym3tri

Calcular la altura vertical de un texto SVG

Respuesta

Cuestiones relacionadas