svgdotjs/svg.js

TSPAN dx value in SVG which is not connected to DOM

markocrni opened this issue · 1 comments

I comment in this section, but this is probably a problem for itself, and again it refers to tspans, and their dx value. I've been working with svg that isn't attached to the DOM, and I've come to the conclusion that this part is causing the problem (tspan):
const fontSize = globals.window.getComputedStyle(this.node)
Since SVG is not part of DOM, getComputedStyle cannot read font size and value always will be 0. Setting value by .dx(20) also doesn't work.

Originally posted by @markocrni in #1088 (comment)

This is by design. svg.js cannot infer a fontsize if its not in the dom. So you cannot use the newLine feature of svg.js because it doesnt know the line-height.
However, you can build up your text strings on your own without any svg.js magic by disabling rebuilding of text:

const text = canvas.text().rebuild(false).text(function(text) {
  text.tspan("Hello").dy(3)
  text.tspan("World).dx(1).dy(-3)
})