javascript - 是否可以让我的粒子可点击？

Question

我有以下粒子脚本（从网上找到并编辑！）：http: //jsfiddle.net/neuroflux/hSkFX/1/

我想知道使每个粒子“可点击”的最简单方法是什么？

我知道这些不是元素，而是 x/y/radius 点。

你认为最简单的方法是什么？

干杯!

[编辑]这个问题是关于点击区域而不是点击事件....

Answer 1

没有办法真正知道您单击了画布中的元素。您所知道的是用户在画布对象上单击的 x/y 位置。您可以采用该 x/y 位置并确定是否有东西。另一种选择是检查那里的像素颜色，看看它是否有颜色。

Answer 2

我发现本教程特别有用！ http://simonsarris.com/blog/510-making-html5-canvas-useful 这是您需要的相关部分：

// Determine if a point is inside the shape's bounds
    Shape.prototype.contains = function(mx, my) {
// All we have to do is make sure the Mouse X,Y fall in the area between
// the shape's X and (X + Height) and its Y and (Y + Height)
    return  (this.x <= mx) && (this.x + this.w >= mx) &&
          (this.y <= my) && (this.y + this.h >= my);
    }

您需要为您的 Circle() 对象实现 .contains 函数，但是您必须通过将光标位置与圆心的距离与圆半径进行比较来更改方法，如果更小则返回一个。