{{SVGRefElem}}
The polyline
element is an SVG basic shape that creates straight lines connecting several points. Typically a polyline
is used to create open shapes as the last point doesn't have to be connected to the first point. For closed shapes see the {{SVGElement("polygon")}} element.
Usage context
{{svginfo}}
Example
Source code | Output result |
---|---|
{{embed_text("polyline.svg", "xml")}} | {{EmbedSVG("polyline.svg",120,120)}} |
Attributes
Global attributes
- Conditional processing attributes »
- Core attributes »
- Graphical event attributes »
- Presentation attributes »
- {{SVGAttr("class")}}
- {{SVGAttr("style")}}
- {{SVGAttr("externalResourcesRequired")}}
- {{SVGAttr("transform")}}
Specific attributes
- {{SVGAttr("points")}}
DOM Interface
This element implements the SVGPolylineElement
interface.
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('SVG2', 'shapes.html#PolylineElement', '<polyline>')}} | {{Spec2('SVG2')}} | |
{{SpecName('SVG1.1', 'shapes.html#PolylineElement', '<polyline>')}} | {{Spec2('SVG1.1')}} | Initial definition |
Browser compatibility
{{CompatibilityTable}}
Feature | Chrome | Firefox (Gecko) | IE | Opera | Safari |
---|---|---|---|---|---|
Basic support | {{CompatChrome('1.0')}} | {{CompatGeckoDesktop('1.8')}} | {{CompatIE('9.0')}} | {{CompatOpera('8.0')}} | {{CompatSafari('3.0.4')}} |
Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | {{CompatAndroid('3.0')}} | {{CompatGeckoMobile('1.8')}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatSafari('3.0.4')}} |
The chart is based on these sources.
See also
- {{SVGElement("line")}}
- {{SVGElement("polygon")}}
{{SVGRef}}