Kozea
Support for SVG images text along a path
Hello, I am using WeasyPrint 56.0, trying to convert html with an svg image:
<html>
<body>
<img src="simple_path.svg"/>
</body>
</html>
where this is the svg image src:
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 300 300" xmlns:xlink="http://www.w3.org/1999/xlink">
<path id="curve" d="M 10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80" fill="none" stroke="black"/>
<text>
<textPath xlink:href="#curve">
Text along the path with id "curve"
</textPath>
</text>
</svg>
The rendered html file looks like this:
However, after converting to pdf the results are:
Here are the files:
SVG image contents output PDF HTML file contents
I am hoping to render many svg images with text along a path like this so I am hoping for WeasyPrint to support this. Thanks!
Hi!
We used to support text on a path when we were using CairoSVG, but now it’s a really, really more difficult.
Cairo provides a copy_path_flat that gives an approximation of the path only using segments. That’s really useful for 2 crucial points: 1) it’s the only way to know the length of the path, and 2) it’s the only way to know where the path should be drawn.
But we don’t use Cairo anymore. Recreating this will probably require A LOT of work 😒.
Thank you for your reply! My goal is to put text in an arc shape. Is there any workaround or different solution that you would suggest that is supported?
Thank you for your reply! My goal is to put text in an arc shape. Is there any workaround or different solution that you would suggest that is supported?
It "could" be "possible" to handle some use cases, but still would require a lot of work (and probably of code).
The cornerstone of the solution would be to recode point_following_path: get two coordinates and an angle, given a path and a distance. But instead of having a Cairo path (only made of MOVEs and LINEs because it’s been flattened by Cairo), we would only have the d string of the path.
Some SVG path commands are "quite easy" to handle: M, L, H, V. A may be possible (but it looks more like a nightmare than a great challenge for me). I’m not even sure that an exact solution has been mathematically found for Bézier curves, but it could be possible to get a quite good approximation (just as it’s done in CairoSVG), as long as you really like maths.
And of course, we also would have to handle correctly transformation matrices 😁.