Pen Path API

Overview

Use the pen path APIs to create vector paths and edit anchor points programmatically. These calls mirror interactive path edits and generate standard history entries.

Create a Pen Path

const pathId = editor.addPenPath({
  points: [
    { x: 120, y: 160, type: 'corner' },
    { x: 220, y: 200, type: 'corner' },
  ],
  stroke: '#222222',
  strokeWidth: 2,
})

• points are provided in canvas coordinates.
• Points are normalized to local coordinates; the path transform stores the offset from the minimum x/y.

Add or Insert Points

editor.addPenPoint(pathId, { x: 180, y: 220, type: 'corner' }, 1)
editor.insertPenPoint(pathId, { x: 140, y: 180, type: 'corner' }, 0)

• The index is clamped to the valid range.
• The returned value is the inserted index, or null if the path is missing.

Remove Points

editor.removePenPoint(pathId, 1)

• Removing a point when only two points remain throws an error.

Notes

• addPenPath requires at least two points.
• Path edits trigger the same update events as interactive edits.