How to draw custom canvas shape with Vue?

To create a custom shape with vue-konva, we should use v-shape component.

When creating a custom shape, we need to define a drawing function that is passed a Konva.Canvas renderer.

We can use the renderer to access the HTML5 Canvas context, and to use special methods like context.fillStrokeShape(shape) which automatically handles filling, stroking, and applying shadows.

Enjoying Konva? Please consider to support the project.