- From: Mike Bremford via GitHub <sysbot+gh@w3.org>
- Date: Sun, 08 Mar 2020 14:55:23 +0000
- To: public-css-archive@w3.org
The ability to warp text (in particular) would be hugely useful. and I've seen this floated The most common way to do this is define a mapping from a grid of points describing the input rectangle, to the same grid with the points moved to their new locations. This concept describes the superset of most (if not all) 2D transformations - both of your cases above @Karric, plus quite a few others - think the "sphere", "pinch" and "warp" filters from Photoshop and others. However, can I suggest that `transform` is not the place for this - first because describing a complex manifold with a list of arguments to a single function is going to get out of hand very quickly, and second because this sort of transform converts straight lines to curves, which means it's almost certainly going to be handled in a completely different code path to the current range of transforms, all of which all collapse to a single Matrix multiplication. I think this would be best done as a new filter - think feDisplacementMap ([example](https://tympanus.net/codrops/2019/02/12/svg-filter-effects-conforming-text-to-surface-texture-with-fedisplacementmap/)), but with the displacement map described with the sort of structure already proposed for SVG [mesh gradients](http://tavmjong.free.fr/blog/?p=316). Incidentally the reason I'm jumping into this issue is because it's been rattling around in my head for about a year or so, as I try to figure out the best way to do it. When I get some time I'm hoping to prototype something which will probably look roughly like the idea outlined above, to see how well it works. Finally, getting this specified is one thing, getting it implemented is another. I tried this out (with an feDisplacementMap) at https://output.jsbin.com/puwayor, which sort of works in Webkit and not at all in Gecko/Blink. Some references: https://benjamminf.github.io/warpjs/ https://lists.w3.org/Archives/Public/www-svg/2014Sep/0008.html http://tavmjong.free.fr/SVG/TEXT_PATH/TextPath.html -- GitHub Notification of comment by faceless2 Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4845#issuecomment-596214359 using your GitHub account
Received on Sunday, 8 March 2020 14:55:25 UTC