# SVG Notes: Polyline

# Basic Structure

```xml
<polyline points="10,10 50,50 90,10 70,80" />
```

**points** attribute = list of x,y coordinates separated by spaces or commas:

* `10,10` = first point
    
* `50,50` = second point
    
* `90,10` = third point
    
* `70,80` = fourth point
    

Lines connect each point to the next in order, but it doesn't connect the last point back to the first.

# Different Point Formats

```xml
<!-- Comma-separated -->
<polyline points="10,10 50,50 90,10" />

<!-- Space-separated -->
<polyline points="10 10 50 50 90 10" />

<!-- Mixed (both work) -->
<polyline points="10,10 50,50 90 10" />
```

### Styling

```xml
<polyline points="10,10 50,50 90,10" 
          stroke="red" 
          stroke-width="3" 
          fill="none" />
```

**Important**: Usually set `fill="none"` because polylines create weird filled shapes if you don't. The stroke is what you typically want to see.