SVG 'polyline' element

The SVG <polyline> element is used to draw several connected straight lines. The <polyline> element has only one attribute - points - it defines points that make up a polyline. x and y coordinates of points ate separated with commas.

Here is a simple example:

<polyline points="50,135 100,10 150,135 25,60 175,60"/>

As you may notice the black colour is the default fill colour, to set another colour use the style fill attribute. At the next example you may also notice that not all the lines are stroked - only lines between the points listed are drawn. To improve this you should add the starting point again (in the example the point is underlined).

<polyline points="50,135 100,10 150,135 25,60 175,60 50,135" fill="#9d1d20" stroke="black" stroke-width="2"/>