Support textPath geometry via CSS

[AmeliaBR]

In SVG 1/1.1, text-on-a-path requires a <textPath> element that links to a separate <path> element. Various attributes on the <textPath> control behavior, some of which are poorly implemented.

For SVG 2, the working group had resolved to:

• Make it possible to directly specify the path geometry on the <textPath> instead of requiring a separate element.
• Make it possible to reference a basic shape element instead of a <path>.
• Make it possible to specify which side of a path to align text on, without manually reversing the path data string.

Given the general push to move geometry and layout to CSS properties, it makes sense to move the path geometry declaration to a style property. To do that, the following requirements must be accommodated:

• Need a unique property name that isn't confused with the geometry of a <path> shape. (See Issue d geometric property needs a clear & extensible name #49).
• Need to support both references to other elements as well as direct path values.
• Need to support startOffset in CSS as well, preferably in a way that is consistent with CSS-ifying x/y/dx/dy on other text elements.

My recommendations:

No one seems to have implemented the d attribute on <textPath> yet. Therefore, we could replace it with a new property/presentation attribute pair with an appropriately unique name and a CSS-friendly syntax.

• For SVG 2, decide on a unique name (not d) for the path geometry attribute, but (for now) only make it available as an attribute on <textPath>. I'd suggest something like baseline-shape or baseline-path to reflect the relationship to other text layout properties.
• Use CSS shape functions as the value of the new attribute, as opposed to bare path data strings. This is both future-friendly and author-friendly, as it makes it even easier to create text on a circle/ellipse/simple polygon.
• Incorporate the side parameter as an additional keyword in the same property rather than as a separate attribute.

In other words, something like:

<textPath baseline-shape="circle( calc(50% - 1em) at center) left">Text in a circle</textPath>

Then, create a separate text path module to address remaining issues and explore more complex text path features. Some options for the new module:

• Deprecate (xlink:)href on <textPath> in favour of a url() value in the presentation attribute.
• CSS-ify the other textPath attributes.
• Support the other text layout geometric attributes (x/y/dx/dy) in a manner consistent with other text elements.
• Create better options for glyph stretch/align method.
• Support more complex text distortion: the property could take a list of paths and corresponding baseline keywords (e.g., text-top, text-bottom, central), to create a convolution mesh to stretch glyphs to fit (with appropriate new options for the text-path method attribute). This has been available in MS Word since the 90s and has been a long-requested feature for SVG.