DrawLine1.vue 734 B

1234567891011121314151617181920212223242526272829303132
  1. <template>
  2. <canvas id="drawLine1" width="800" height="100" />
  3. </template>
  4. <script lang="ts">
  5. import { SCanvasView, SColor, SPainter } from "@saga-web/draw/lib";
  6. class TestView extends SCanvasView {
  7. constructor() {
  8. super("drawLine1")
  9. }
  10. onDraw(canvas: SPainter): void {
  11. // 在此编写绘制操作相关命令
  12. canvas.drawLine(0,0, 100, 100);
  13. canvas.pen.lineWidth = 1;
  14. canvas.pen.dashOffset += 10;
  15. canvas.pen.lineDash = [25, 5, 10, 30];
  16. canvas.drawLine(200, 50, 400, 50);
  17. this.update();
  18. }
  19. }
  20. export default {
  21. mounted() {
  22. new TestView();
  23. }
  24. }
  25. </script>