Cet article est également disponible en français
Groups - the <g> tag in SVG - are somewhat akin to <div> elements on web pages, in that they contain and control related SVG elements. However, there are some very distinct differences between <g> and <div> elements are important to understand:
Cet article est également disponible en français
If you’re after a line or an open shape, rather than a closed polygon or circle, SVG has two options for you: lines and polylines.
Cet article est également disponible en français
If you want a closed SVG shape that is more than a basic circle, ellipse or rectangle, you’ll need to create a polygon.
In SVG, a polygon is any closed shape that consists of straight line segments: SVG doesn’t yet have elements for regular polygons (no <star /> or <hexagon />); instead, it simply allows you to make closed shapes of any kind by specifying points. While three or four-point polygon shapes are easy to code by hand, you’ll probably want to use a graphical editor like Adobe Illustrator, Inkscape or PhotoShop to create more complex designs, exporting them as SVG. Regardless, it’s very useful to understand the basics of SVG polygons, as doing so allows you to “tweak” and alter shapes in code without relying on graphical editors.
