CODEWITHSUNDEEP
htmlsvg
Karthikeyan Ganesan
Karthikeyan Ganesan

Reputation: 2035

how to join svg polyline's one end to other end in html

How would I change the markup below in order to join the endpoints of the polyline.

<html>
<head>
</head>
<body>

<svg height="200" width="500">
 <polyline points="20,20 40,25 60,40 80,120 120,140 200,180"
  style="fill:none;stroke:black;stroke-width:3" />
 </svg>
</body>
</html>

Upvotes: 0

Views: 187

Answers (2)

Paul LeBeau
Paul LeBeau

Reputation: 101860

Use <polygon> instead of <polyline>.

<svg height="200" width="500">
  <polygon points="20,20 40,25 60,40 80,120 120,140 200,180"
           style="fill:none;stroke:black;stroke-width:3" />
</svg>

Upvotes: 1

Soheil Hassas Yeganeh
Soheil Hassas Yeganeh

Reputation: 1379

Add the first point to the end of the list:

<svg height="200" width="500">
 <polyline points="20,20 40,25 60,40 80,120 120,140 200,180 20,20"
           style="fill:none;stroke:black;stroke-width:3" />
 </svg>
</body>

Upvotes: 0

Related Questions