在ionic 3上的两个标记之间绘制路径

<canvas id="myCanvas"></canvas>

import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent implements AfterViewInit {
  @ViewChild('myCanvas') canvasRef: ElementRef;

  ngAfterViewInit() {
    this.drawPath();
  }

  drawPath() {
    const canvas = this.canvasRef.nativeElement;
    const ctx = canvas.getContext('2d');

    // 设置路径起点
    ctx.moveTo(50, 50);

    // 绘制路径
    ctx.lineTo(200, 200);

    // 设置路径样式
    ctx.lineWidth = 2;
    ctx.strokeStyle = 'red';

    // 绘制路径
    ctx.stroke();
  }
}

canvas {
  width: 100%;
  height: 100%;
}