Examining Inkscape SVG animation example. Rectangle moving along path.
Adding comments to explain the elements a bit better.
And playing a little too.
For the path element detail see also http://www.w3.org/TR/SVG/paths.html
Path Line Example "Mx,y A? ? ? ? ? || x y A? ? ? ? ? || x y .... (repeats, ending on x y) x y"
M l c - moveto line curve
L x y - lineto x y
A rx ry xrotate bLarge bSweep x y - ellipticalArc
Z - closepath
e.g. path id="myAniPath" d="M10,150 A15 15 180 0 1 70 140 A15 25 180 0 0 130 130 A15 55 180 0 1 190 120 A15 10 170 0 1 10 150"
Nuts. Cannot treat .svg as simple image with blogger.
Also have not yet found an easy+safe way to post in code snippets.
Also have not yet found an easy+safe way to post in code snippets.
Look at this (and view source on this, and click the green and purple boxes): http://www.dspsrv.com/~jamesc/motionpathJCO.svg
No comments:
Post a Comment