12345678910111213141516171819202122232425262728293031323334353637383940414243 |
- <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";
- /**
- * 绘制折线
- *
- * @author 郝洁 <haojie@persagy.com>
- */
- class TestView extends SCanvasView {
- arr: SPoint[] = [new SPoint(10, 10), new SPoint(10, 40), new SPoint(30, 30)];
- /**
- * 构造函数
- */
- constructor() {
- super("drawPolyline1")
- }
- /**
- * Item 绘制操作
- * @param painter 绘制对象
- */
- onDraw(canvas: SPainter): void {
- // 绘制折线
- canvas.drawPolyline(this.arr);
- }
- }
- @Component
- export default class DrawPolyline1 extends Vue {
- /**
- * 页面挂载
- */
- mounted(): void {
- new TestView();
- }
- }
- </script>
|