Re: [idea] lighweight inline vector images in CSS and HTML

On Sun, Mar 20, 2016 at 12:24 AM, Peter Moulder <pjrm@mail.internode.on.net>
wrote:

> For purposes of evaluating this proposal, the closest existing mechanism
> that
> I'm aware of is:
>
> >   background-image: url( path: M0,0 L50,100 L100,0z );
>
> background-image: url(data:image/svg,<svg><path d="M0,0 L50,100
> L100,0z"/></svg>)
>

You don't just need to define shape but to style it too:

div {  fill: red; background-image: url( path: M0,0 L50,100 L100,0z );  }
div:hover {  fill: gold; }

You cannot do that by CSS of host document.

Yet, SVG is quite heavy for the purpose of just defining path.



>
> > All "absolute" commands (uppercase ones:  MLHVCSQTA) when given negative
> > coordinates use those as offset from right and bottom sides of image box:
>
> Having SVG coordinates adapt to available space isn't satisfactorily
> possible
> to my knowledge, beyond the sense that any image can be stretched to fill
> available space (with text and strokes simply stretching with the rest of
> the
> image).
>
> As noted in the papers below, javascript is possible, but hardly
> satisfactory.
>
> Use of calc, vw/vh units, and coordinate properties would be one
> obvious extension (does it already exist?).
>
> The Constraint SVG proposals also spring to mind:
>
>   http://www.csse.monash.edu.au/~clm/2004/07/csvg.html
>     (at WWW13, 2004; said to be implemented in Batik),
>
>   https://constraints.cs.washington.edu/web/csvg-www10/
>     (at WWW10, 2001)
>
> pjrm.
>
>
There are no means in SVG to say "10px from right and 20px from bottom"

Other than just drawing paths CSS has a need to define paths in other
places.
For example here: https://www.w3.org/TR/css-shapes-1/

To have unified path notation would be beneficial I think.


-- 
Andrew Fedoniouk.

http://sciter.com