improved event edge detection algo

This commit is contained in:
Eric Rowell 2013-11-27 21:53:41 -08:00
parent 96a9bd2248
commit 658064b5ef
2 changed files with 23 additions and 7 deletions

View File

@ -44,22 +44,26 @@
* method for determining if a point intersects a shape or not * method for determining if a point intersects a shape or not
* @method * @method
* @memberof Kinetic.Layer.prototype * @memberof Kinetic.Layer.prototype
* @param {Kinetic.Shape} shape * @param {Kinetic.Shape|null} shape
*/ */
getIntersection: function() { getIntersection: function() {
var pos = Kinetic.Util._getXY(Array.prototype.slice.call(arguments)), var pos = Kinetic.Util._getXY(Array.prototype.slice.call(arguments)),
shape, i, intersectionOffset; obj, i, intersectionOffset, shape;
if(this.isVisible()) { if(this.isVisible()) {
for (i=0; i<INTERSECTION_OFFSETS_LEN; i++) { for (i=0; i<INTERSECTION_OFFSETS_LEN; i++) {
intersectionOffset = INTERSECTION_OFFSETS[i]; intersectionOffset = INTERSECTION_OFFSETS[i];
shape = this._getIntersection({ obj = this._getIntersection({
x: pos.x + intersectionOffset.x, x: pos.x + intersectionOffset.x,
y: pos.y + intersectionOffset.y y: pos.y + intersectionOffset.y
}); });
shape = obj.shape;
if (shape) { if (shape) {
return shape; return shape;
} }
else if (!obj.antialiased) {
return null;
}
} }
} }
else { else {
@ -68,16 +72,26 @@
}, },
_getIntersection: function(pos) { _getIntersection: function(pos) {
var p = this.hitCanvas.context._context.getImageData(pos.x, pos.y, 1, 1).data, var p = this.hitCanvas.context._context.getImageData(pos.x, pos.y, 1, 1).data,
p3 = p[3],
colorKey, shape; colorKey, shape;
// this indicates that a hit pixel may have been found // fully opaque pixel
if(p[3] === 255) { if(p3 === 255) {
colorKey = Kinetic.Util._rgbToHex(p[0], p[1], p[2]); colorKey = Kinetic.Util._rgbToHex(p[0], p[1], p[2]);
shape = Kinetic.shapes[HASH + colorKey]; shape = Kinetic.shapes[HASH + colorKey];
return shape; return {
shape: shape
};
} }
// antialiased pixel
else if(p3 > 0) {
return {
antialiased: true
};
}
// empty pixel
else { else {
return null return {};
} }
}, },
drawScene: function(canvas) { drawScene: function(canvas) {

View File

@ -217,6 +217,8 @@ suite('Stage', function() {
assert.equal(stage.getIntersection(371, 93).getId(), 'greenCircle', 'shape should be greenCircle'); assert.equal(stage.getIntersection(371, 93).getId(), 'greenCircle', 'shape should be greenCircle');
assert.equal(stage.getIntersection(372, 93).getId(), 'redCircle', 'shape should be greenCircle'); assert.equal(stage.getIntersection(372, 93).getId(), 'redCircle', 'shape should be greenCircle');
//console.log(layer.hitCanvas.context._context.getImageData(1, 1, 1, 1).data)
}); });