Javascript 画布在爱奥尼亚2中工作吗？

我目前正在使用html5画布，通过在html画布上使用ionic 2（tap）=“markPoint（$event）”，我获得了tap事件的位置。以下是应放置标记的功能：

public markPoint(event) {
    var position = event.center;
    let ctx = this.canvas.getContext('2d');
    ctx.beginPath();
    ctx.arc(position.x, position.y, 20, 0, 2 * Math.PI);
    ctx.fillStyle = '#00DD00';
    ctx.fill();
}

我这样设置画布，其中画布是html中设置的id：

this.canvas = document.getElementById('canvas');

---

我不认为这段代码有什么问题，但是我也不确定这是否是在ionic 2中的应用程序中进行标记的最佳方法。你知道这是否可行，如果不行，为什么？还有，如果有更好的方法，在这里介绍一下它们会很棒。

首先，我们必须使打字脚本更加友好。仅使用id获取画布对象像另一个HTML元素一样是不够的。在本例中，我们应该提供一些帮助，因此我的第一个更改是：

this.canvas = document.getElementById('canvas');

FOR=>

this.canvas = <HTMLCanvasElement>document.getElementById('canvas');

希望这有帮助

public markPoint(event) {
    var position = event.center;
    let ctx: CanvasRenderingContext2D = this.canvas.getContext("2d");
    ctx.beginPath();
    ctx.arc(position.x, position.y, 20, 0, 2 * Math.PI);
    ctx.fillStyle = '#00DD00';
    ctx.fill();
}