`text.rebuild()` overwrites `dy` if the `tspan` had previously had `newLine()` called on it
tspan.newLine() does two things
- It sets dy to the line height, and dx to the left margin
- It sets the
newLinedflag
When a text element is rebuilt, it looks at the newlined flag and it set it updates dy to the lineheight again.
However, I wanted my SVG text to have a number of extra blank lines, so I wrote:
tspan.newLine()
if (pendingNewlines > 1) {
let lineHeight = tspan.dy()
tspan.dy(pendingNewlines * lineHeight)
}
pendingNewlines = 0
This correctly sets dy in the dom initially. However, at some point test.rebuild gets called, and the extra line spacing is lost.
This pen illustrates the problem:
https://codepen.io/pragdave/pen/rNOEpgW
Suggested fix
Rather than have newLined be boolean, make it a count. Change the API of tspan.newLine() to be
newLine(factor=1) {
...
}
and have it set dy to factor*lineheight. Keep the factor in the dom entry (replacing newLined) and repeat the calculation on rebuild.
I'd be happy to generate a PR if this sounds reasonable. (I'd even update the docs :)
Dave
If you need a blank line, just create an empty tspan. svg.js should handle the rest. Would that resolve your issue?
I'd be happy to generate a PR if this sounds reasonable. (I'd even update the docs :)
You are a true hero! :D
Empty tspans are ignored, I believe...
You are a 100% correct ;). But I believe in svg.js (no joke, that is a case that is handled in the rebuild function)
See the updated pen... https://codepen.io/pragdave/pen/rNOEpgW
Strange... let me investigate after I am back from work. If you want you can have a look yourself. In the rebuild function there is something like newLineOffset or so. Thats the place to look
So jeah - you have to add an actual newline to the tspan for it to work :D. Is there even a usecase for this? I will look into it later. No free head for that
https://codepen.io/fuzzyma/pen/NWGZmqB