svgedit
svgedit copied to clipboard
how to make text multi-line?
how to make text multi-line
how to make text multi-line
Hello, this is not yet supported.
how to make text multi-line
Hello, this is not yet supported.
ok, hope it will some day
@jfhenon we have been thinking about the same feature, and I have the following thought:
- Multiline text with advanced formatting with pure SVG/js is very difficult to implement
- There are excellent open-source HTML text editors (TMCE, Quill)
- There are pretty good libraries (e,g, https://github.com/felixfbecker/dom-to-svg) for converting HTML to SVG
- Perhaps it would be possible to combine the two?
So:
- Upon click, launch external HTML text editor inside foreignObject
- Upon end of editing, convert HTML to svg and add as an embedded SVG (or group) to the main SVG
- Store HTML in data property for future editing (helpful for search engines)
What do you think?
My opinion is that we indeed need multiline support. I'm not sure we want to add so many new dependencies for this. could we rather go for a simpler multiline support (same fonts, same color, same size but multiple lines) in the "standard" svgEdit?A more advanced editor could be proposed as an extension.
Agreed, extension is certainly the way to go.
The problem with implementing both is that the code will be completely different, and much more complicated in case of pure svg implementation (via tspan elements - see e.g. https://www.oreilly.com/library/view/svg-text-layout/9781491933817/ch04.html). Perhaps implementing pure-svg multiline-only text will not be too difficult, but adding local formatting certainly will, prohibiting future development. This could change with SVG 2.0.
All in all, I would like to give the HTML-editor route a try via an extension.
As I commented at https://github.com/SVG-Edit/svgedit/issues/838#issuecomment-1475551771
SVG 2 Flowed Text support this feature. https://www.w3.org/TR/SVG/text.html#TextLayoutContentArea http://tavmjong.free.fr/SVG/TEXT_FLOW/
In SVG 1.1, multi-line text can be implemented by multiple <tspan>
elements. yes it's difficult.
https://www.oreilly.com/library/view/svg-text-layout/9781491933817/ch04.html
oh ? but how to integrate to svgedit