{"id":9303,"date":"2022-10-06T04:41:38","date_gmt":"2022-10-06T04:41:38","guid":{"rendered":"https:\/\/mdr.foobrdigital.com\/?p=9303"},"modified":"2022-10-06T04:41:38","modified_gmt":"2022-10-06T04:41:38","slug":"svg-polyline","status":"publish","type":"post","link":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/2022\/10\/06\/svg-polyline\/","title":{"rendered":"SVG Polyline"},"content":{"rendered":"\n

Description of the <polyline> element<\/h2>\n\n\n\n

The SVG <polyline> element creates any shape consisting of only straight lines that connect multiple points. Unlike the\u00a0<polygon>\u00a0element, the <polyline> creates open shapes.<\/p>\n\n\n\n

Example of the SVG <polyline> element:<\/h3>\n\n\n\n
<!DOCTYPE html>\n<html>\n <head>\n    <title>Title of the document<\/title>\n  <\/head>\n  <body>\n    <svg width=\"400\" height=\"220\" >\n      <polyline points=\"30,30 50,35 70,50 90,130 130,150 210,190\" style=\"fill:none;stroke:purple;stroke-width:5\" \/>\n      Sorry, inline SVG isn't supported by your browser..\n    <\/svg>\n  <\/body>\n<\/html><\/code><\/pre>\n\n\n\n
Example of the SVG <polyline> element with straight lines:<\/h3>\n\n\n\n
<!DOCTYPE html>\n<html>\n  <head>\n    <title>Title of the document<\/title>\n  <\/head>\n  <body>\n    <svg width=\"400\" height=\"200\" >\n      <polyline points=\"10,50 50,50 50,90 90,90 90,130 130,130 130,170\" style=\"fill:white;stroke:blue;stroke-width:5\" \/>\n      Sorry, inline SVG is not supported by your browser.\n    <\/svg>\n  <\/body>\n<\/html><\/code><\/pre>\n\n\n\n
Attributes<\/h2>\n\n\n\n
Attribute<\/th>Description<\/th><\/tr><\/thead>
points<\/td>This attribute specifies the list of points (pairs of x,y absolute coordinates) that are required for drawing the polygon.<\/td><\/tr>
pathLength<\/td>This attribute specifies the total length for the path, in user units.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
The SVG <polyline> element also supports the\u00a0Global Attributes\u00a0and\u00a0Event Attributes.<\/p>\n","protected":false},"excerpt":{"rendered":"
Description of the <polyline> element The SVG <polyline> element creates any shape consisting of only straight lines that connect multiple points. Unlike the\u00a0<polygon>\u00a0element, the <polyline> creates open shapes. Example of the SVG <polyline> element: Example of the SVG <polyline> element with straight lines: Attributes Attribute Description points This attribute specifies the list of points (pairs […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[574],"tags":[],"_links":{"self":[{"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/posts\/9303"}],"collection":[{"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/comments?post=9303"}],"version-history":[{"count":0,"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/posts\/9303\/revisions"}],"wp:attachment":[{"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/media?parent=9303"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/categories?post=9303"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mudassirbackup.infinitycodestudio.com\/index.php\/wp-json\/wp\/v2\/tags?post=9303"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}