html5 isPointInPath相关操作
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html5 isPointInPath相关操作相关的知识，希望对你有一定的参考价值。
<body>
<canvas id="c1" width="400" height="400">
</canvas>
<script type="text/javascript">
var oC = document.getElementById("c1");
var oGC = oC.getContext("2d");
var c1 = new Shape(100, 100, 50);
var c2 = new Shape(200, 200, 50);
oC.onmousedown = function (ev) {
var ev = ev || window.event;
var point = {
x: ev.clientX - oC.offsetLeft,
y: ev.clientY - oC.offsetTop
};
c1.reDraw(point);
c2.reDraw(point);
}
c1.click = function () {
alert(123);
}
c2.click = function () {
alert(456);
}
function Shape(x, y, r) {
this.x = x;
this.y = y;
this.r = r;
oGC.beginPath();
oGC.arc(x, y, r, 0, 360 * Math.PI / 180,false);
oGC.closePath();
oGC.fill();
}
Shape.prototype.reDraw = function (point) {
oGC.beginPath();
oGC.arc(this.x, this.y, this.r, 0, 360 * Math.PI / 180, false);
oGC.closePath();
oGC.fill();
if (oGC.isPointInPath(point.x, point.y)) {
this.click();
}
}
</script>
</body>
以上是关于html5 isPointInPath相关操作的主要内容，如果未能解决你的问题，请参考以下文章
[ javascript canvas isPointInPath(x,y) 判断点是否在最后绘制的图形中 ] javascript canvas isPointInPath(x,y) 判断点是否在最
为啥这个 HTML5 地理位置相关的 JavaScript 代码会出错？