> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/browser/canvas/+ext/ctx.polyline.md).

# ctx.polyline()

[browser](/web/browser.md) ⟩ [canvas](/web/browser/canvas.md) ⟩ [path](/web/browser/canvas/path.md) ⟩ ctx.polyline()

{% tabs %}
{% tab title="💾 程式" %}
:floppy\_disk: replit：[canvas curves](https://replit.com/@pegasusroe/canvas-curves#script.js)

⬆️ 需要： [Vector](/web/appendix/custom/class/vector.md)

```javascript
// 🔸 ctx.polyline()
CanvasRenderingContext2D.prototype.polyline = function(pts, {
    color = 'gray',
    lineWidth = 1,
}={}) {

    this.save();
    this.beginPath();

    pts.forEach((p, i) => {
        i === 0 ? this.moveTo(...p.coords) : this.lineTo(...p.coords);
    });

    this.strokeStyle = color;
    this.lineWidth = lineWidth;
    this.stroke();
    this.restore();
};
```

{% endtab %}

{% tab title="⬇️ 應用" %}

* [curves](/web/browser/canvas/path/curve.md)
  {% endtab %}

{% tab title="👥 相關" %}

* SVG [\<polyline>](/web/browser/svg/shape/polyline.md)
  {% endtab %}
  {% endtabs %}