Notes about SVG commands
Last updated at 4:50 pm UTC on 22 October 2020
SVG coordinate system, viewport and viewbox
In an HTML file:
If you have the svg code in a file you may use it directly as an image in a HTML file
<img src="bird.svg" alt="Bird">
An image in an SVG file
group element <g>
The transform attribute may be applied to a group: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform
SVG minimal document - LODraw export
The <polyline> SVG element is an SVG basic shape that creates straight lines connecting several points.
the most complex element. It uses a simple command language to describe a path
- Move to command,
- line to command
- Bezier curves
The "d" attribute contains a series of commands and parameters used by those commands.
M is the 'moveTo' command. As it is upper case it means 'absolute coordinates' which are 2000 @ 0000.
H is horizontal move, V is vertical move, L means 'line from current point to new coordinate'.
SVG construction example 6 - path