I have a Text on a simple path (circular shape, but Path object type because Chrome), and the svg is embedded into HTML with viewBox and preserveAspectRatio="none" so that the image stretches.
When the aspect ratio of the container changes from the set SVG viewBox ratio the image is stretched, which is the desired behaviour, the "circle" paths are stretched into ellipses (or close enough).
The problem is the text that is along the paths is also stretched.
Is there a way to keep the SVG behaviour when it comes to paths, so they stretch according to the container, and keep the text following that stretched path, but prevent the Text from being stretched at the same time?
I know you can embed SVGs one into another, with their distinct viewBox and preserveAspectRatio values, but can it be done with linked objects such as Path and Text on Path?
I have a Text on a simple path (circular shape, but Path object type because Chrome), and the svg is embedded into HTML with viewBox and preserveAspectRatio="none" so that the image stretches.
When the aspect ratio of the container changes from the set SVG viewBox ratio the image is stretched, which is the desired behaviour, the "circle" paths are stretched into ellipses (or close enough).
The problem is the text that is along the paths is also stretched.
Is there a way to keep the SVG behaviour when it comes to paths, so they stretch according to the container, and keep the text following that stretched path, but prevent the Text from being stretched at the same time?
I know you can embed SVGs one into another, with their distinct viewBox and preserveAspectRatio values, but can it be done with linked objects such as Path and Text on Path?