persagy-web-doc/docs/.vuepress/components/engine/shape/DrawPolyline1.vue

<template>
    <canvas height="100" id="drawPolyline1" width="800"/>
</template>

<script lang="ts">
    import { SCanvasView, SPainter, SPoint } from "@persagy-web/draw/lib";
    import { Component, Vue } from "vue-property-decorator";

    class TestView extends SCanvasView {
        arr: SPoint[] = [new SPoint(10, 10), new SPoint(10, 40), new SPoint(30, 30)];

        constructor() {
            super("drawPolyline1")
        }

        onDraw(canvas: SPainter): void {
            // 绘制折线
            canvas.drawPolyline(this.arr);
        }
    }

    @Component
    export default class DrawPolyline1 extends Vue {
        mounted(): void {
            new TestView();
        }
    }
</script>