From 86995a8cb48832e1504ed12f5b19d8bd7b903e75 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89ric=20Lemoine?= Date: Wed, 11 Dec 2013 15:45:08 +0100 Subject: [PATCH 1/5] Rename reversedInstructions array to hitDetectionInstructions --- src/ol/render/canvas/canvasreplay.js | 50 ++++++++++++++-------------- 1 file changed, 25 insertions(+), 25 deletions(-) diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 1aeaf5f3be..843b4050f9 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -80,7 +80,7 @@ ol.render.canvas.Replay = function() { * @protected * @type {Array.<*>} */ - this.reversedInstructions = []; + this.hitDetectionInstructions = []; /** * @private @@ -132,7 +132,7 @@ ol.render.canvas.Replay.prototype.beginGeometry = function(geometry) { this.instructions.push(this.beginGeometryInstruction1_); this.beginGeometryInstruction2_ = [ol.render.canvas.Instruction.BEGIN_GEOMETRY, geometry, 0]; - this.reversedInstructions.push(this.beginGeometryInstruction2_); + this.hitDetectionInstructions.push(this.beginGeometryInstruction2_); }; @@ -289,7 +289,7 @@ ol.render.canvas.Replay.prototype.replayForward = */ ol.render.canvas.Replay.prototype.replayBackward = function(context, transform, renderGeometryFunction, opt_geometryCallback) { - var instructions = this.reversedInstructions; + var instructions = this.hitDetectionInstructions; return this.replay_(context, transform, renderGeometryFunction, instructions, opt_geometryCallback); }; @@ -299,24 +299,24 @@ ol.render.canvas.Replay.prototype.replayBackward = * @private */ ol.render.canvas.Replay.prototype.reverseInstructions_ = function() { - var reversedInstructions = this.reversedInstructions; + var hitDetectionInstructions = this.hitDetectionInstructions; // step 1 - reverse array - reversedInstructions.reverse(); + hitDetectionInstructions.reverse(); // step 2 - reverse instructions within geometry blocks var i; - var n = reversedInstructions.length; + var n = hitDetectionInstructions.length; var instruction; var type; var begin = -1; for (i = 0; i < n; ++i) { - instruction = reversedInstructions[i]; + instruction = hitDetectionInstructions[i]; type = /** @type {ol.render.canvas.Instruction} */ (instruction[0]); if (type == ol.render.canvas.Instruction.END_GEOMETRY) { goog.asserts.assert(begin == -1); begin = i; } else if (type == ol.render.canvas.Instruction.BEGIN_GEOMETRY) { goog.asserts.assert(begin >= 0); - ol.array.reverseSubArray(this.reversedInstructions, begin, i); + ol.array.reverseSubArray(this.hitDetectionInstructions, begin, i); begin = -1; } } @@ -377,12 +377,12 @@ ol.render.canvas.Replay.prototype.endGeometry = this.beginGeometryInstruction1_[2] = this.instructions.length; this.beginGeometryInstruction1_ = null; goog.asserts.assert(!goog.isNull(this.beginGeometryInstruction2_)); - this.beginGeometryInstruction2_[2] = this.reversedInstructions.length; + this.beginGeometryInstruction2_[2] = this.hitDetectionInstructions.length; this.beginGeometryInstruction2_ = null; var endGeometryInstruction = [ol.render.canvas.Instruction.END_GEOMETRY, geometry, data]; this.instructions.push(endGeometryInstruction); - this.reversedInstructions.push(endGeometryInstruction); + this.hitDetectionInstructions.push(endGeometryInstruction); }; @@ -509,7 +509,7 @@ ol.render.canvas.ImageReplay.prototype.drawPointGeometry = this.image_, this.snapToPixel_ ]; this.instructions.push(drawImageInstruction); - this.reversedInstructions.push(drawImageInstruction); + this.hitDetectionInstructions.push(drawImageInstruction); this.endGeometry(pointGeometry, data); }; @@ -539,7 +539,7 @@ ol.render.canvas.ImageReplay.prototype.drawMultiPointGeometry = this.image_, this.snapToPixel_ ]; this.instructions.push(drawImageInstruction); - this.reversedInstructions.push(drawImageInstruction); + this.hitDetectionInstructions.push(drawImageInstruction); this.endGeometry(multiPointGeometry, data); }; @@ -639,7 +639,7 @@ ol.render.canvas.LineStringReplay.prototype.drawFlatCoordinates_ = var moveToLineToInstruction = [ol.render.canvas.Instruction.MOVE_TO_LINE_TO, myBegin, myEnd]; this.instructions.push(moveToLineToInstruction); - this.reversedInstructions.push(moveToLineToInstruction); + this.hitDetectionInstructions.push(moveToLineToInstruction); return end; }; @@ -701,12 +701,12 @@ ol.render.canvas.LineStringReplay.prototype.drawLineStringGeometry = ol.extent.extend(this.extent_, lineStringGeometry.getExtent()); this.setStrokeStyle_(); this.beginGeometry(lineStringGeometry); - this.reversedInstructions.push([ol.render.canvas.Instruction.BEGIN_PATH]); + this.hitDetectionInstructions.push([ol.render.canvas.Instruction.BEGIN_PATH]); var flatCoordinates = lineStringGeometry.getFlatCoordinates(); var stride = lineStringGeometry.getStride(); this.drawFlatCoordinates_( flatCoordinates, 0, flatCoordinates.length, stride); - this.reversedInstructions.push([ol.render.canvas.Instruction.STROKE]); + this.hitDetectionInstructions.push([ol.render.canvas.Instruction.STROKE]); this.endGeometry(lineStringGeometry, data); }; @@ -725,7 +725,7 @@ ol.render.canvas.LineStringReplay.prototype.drawMultiLineStringGeometry = } ol.extent.extend(this.extent_, multiLineStringGeometry.getExtent()); this.setStrokeStyle_(); - this.reversedInstructions.push([ol.render.canvas.Instruction.BEGIN_PATH]); + this.hitDetectionInstructions.push([ol.render.canvas.Instruction.BEGIN_PATH]); this.beginGeometry(multiLineStringGeometry); var ends = multiLineStringGeometry.getEnds(); var flatCoordinates = multiLineStringGeometry.getFlatCoordinates(); @@ -736,7 +736,7 @@ ol.render.canvas.LineStringReplay.prototype.drawMultiLineStringGeometry = offset = this.drawFlatCoordinates_( flatCoordinates, offset, ends[i], stride); } - this.reversedInstructions.push([ol.render.canvas.Instruction.STROKE]); + this.hitDetectionInstructions.push([ol.render.canvas.Instruction.STROKE]); this.endGeometry(multiLineStringGeometry, data); }; @@ -840,7 +840,7 @@ ol.render.canvas.PolygonReplay.prototype.drawFlatCoordinatess_ = var state = this.state_; var beginPathInstruction = [ol.render.canvas.Instruction.BEGIN_PATH]; this.instructions.push(beginPathInstruction); - this.reversedInstructions.push(beginPathInstruction); + this.hitDetectionInstructions.push(beginPathInstruction); var i, ii; for (i = 0, ii = ends.length; i < ii; ++i) { var end = ends[i]; @@ -851,7 +851,7 @@ ol.render.canvas.PolygonReplay.prototype.drawFlatCoordinatess_ = [ol.render.canvas.Instruction.MOVE_TO_LINE_TO, myBegin, myEnd]; var closePathInstruction = [ol.render.canvas.Instruction.CLOSE_PATH]; this.instructions.push(moveToLineToInstruction, closePathInstruction); - this.reversedInstructions.push(moveToLineToInstruction, + this.hitDetectionInstructions.push(moveToLineToInstruction, closePathInstruction); offset = end; } @@ -860,13 +860,13 @@ ol.render.canvas.PolygonReplay.prototype.drawFlatCoordinatess_ = if (goog.isDef(state.fillStyle)) { var fillInstruction = [ol.render.canvas.Instruction.FILL]; this.instructions.push(fillInstruction); - this.reversedInstructions.push(fillInstruction); + this.hitDetectionInstructions.push(fillInstruction); } if (goog.isDef(state.strokeStyle)) { goog.asserts.assert(goog.isDef(state.lineWidth)); var strokeInstruction = [ol.render.canvas.Instruction.STROKE]; this.instructions.push(strokeInstruction); - this.reversedInstructions.push(strokeInstruction); + this.hitDetectionInstructions.push(strokeInstruction); } return offset; }; @@ -891,11 +891,11 @@ ol.render.canvas.PolygonReplay.prototype.drawPolygonGeometry = this.setFillStrokeStyles_(); this.beginGeometry(polygonGeometry); if (goog.isDef(state.fillStyle)) { - this.reversedInstructions.push( + this.hitDetectionInstructions.push( [ol.render.canvas.Instruction.SET_FILL_STYLE, state.fillStyle]); } if (goog.isDef(state.strokeStyle)) { - this.reversedInstructions.push( + this.hitDetectionInstructions.push( [ol.render.canvas.Instruction.SET_STROKE_STYLE, state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin, state.miterLimit, state.lineDash]); @@ -927,11 +927,11 @@ ol.render.canvas.PolygonReplay.prototype.drawMultiPolygonGeometry = this.setFillStrokeStyles_(); this.beginGeometry(multiPolygonGeometry); if (goog.isDef(state.fillStyle)) { - this.reversedInstructions.push( + this.hitDetectionInstructions.push( [ol.render.canvas.Instruction.SET_FILL_STYLE, state.fillStyle]); } if (goog.isDef(state.strokeStyle)) { - this.reversedInstructions.push( + this.hitDetectionInstructions.push( [ol.render.canvas.Instruction.SET_STROKE_STYLE, state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin, state.miterLimit, state.lineDash]); From 3019933cb6356fc5307afe5b4b62a9d64c18240f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89ric=20Lemoine?= Date: Wed, 11 Dec 2013 15:45:35 +0100 Subject: [PATCH 2/5] Rename reverseInstructions_ function to reverseHitDetectionInstructions_ --- src/ol/render/canvas/canvasreplay.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 843b4050f9..24229b0f81 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -298,7 +298,8 @@ ol.render.canvas.Replay.prototype.replayBackward = /** * @private */ -ol.render.canvas.Replay.prototype.reverseInstructions_ = function() { +ol.render.canvas.Replay.prototype.reverseHitDetectionInstructions_ = + function() { var hitDetectionInstructions = this.hitDetectionInstructions; // step 1 - reverse array hitDetectionInstructions.reverse(); @@ -548,7 +549,7 @@ ol.render.canvas.ImageReplay.prototype.drawMultiPointGeometry = * @inheritDoc */ ol.render.canvas.ImageReplay.prototype.finish = function() { - this.reverseInstructions_(); + this.reverseHitDetectionInstructions_(); // FIXME this doesn't really protect us against further calls to draw*Geometry this.anchorX_ = undefined; this.anchorY_ = undefined; @@ -750,7 +751,7 @@ ol.render.canvas.LineStringReplay.prototype.finish = function() { if (state.lastStroke != this.coordinates.length) { this.instructions.push([ol.render.canvas.Instruction.STROKE]); } - this.reverseInstructions_(); + this.reverseHitDetectionInstructions_(); this.state_ = null; }; @@ -954,7 +955,7 @@ ol.render.canvas.PolygonReplay.prototype.drawMultiPolygonGeometry = */ ol.render.canvas.PolygonReplay.prototype.finish = function() { goog.asserts.assert(!goog.isNull(this.state_)); - this.reverseInstructions_(); + this.reverseHitDetectionInstructions_(); this.state_ = null; }; From 87125093006f1db4ae6194431874a0dbf26b4c44 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89ric=20Lemoine?= Date: Wed, 11 Dec 2013 15:50:21 +0100 Subject: [PATCH 3/5] Rename replayBackward functions to replayHitDetection --- src/ol/render/canvas/canvasreplay.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 24229b0f81..79a254655c 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -287,7 +287,7 @@ ol.render.canvas.Replay.prototype.replayForward = * @return {T|undefined} Callback result. * @template T */ -ol.render.canvas.Replay.prototype.replayBackward = +ol.render.canvas.Replay.prototype.replayHitDetection = function(context, transform, renderGeometryFunction, opt_geometryCallback) { var instructions = this.hitDetectionInstructions; return this.replay_(context, transform, renderGeometryFunction, @@ -1112,15 +1112,16 @@ ol.render.canvas.ReplayGroup.prototype.replay = function(context, extent, * @return {T|undefined} Callback result. * @template T */ -ol.render.canvas.ReplayGroup.prototype.replayBackward_ = function(zs, context, - extent, transform, renderGeometryFunction, geometryCallback) { +ol.render.canvas.ReplayGroup.prototype.replayHitDetection_ = + function(zs, context, extent, transform, renderGeometryFunction, + geometryCallback) { var i, ii, replayes, replayType, replay, result; for (i = 0, ii = zs.length; i < ii; ++i) { replayes = this.replayesByZIndex_[zs[i].toString()]; for (replayType in replayes) { replay = replayes[replayType]; if (ol.extent.intersects(extent, replay.getExtent())) { - result = replay.replayBackward( + result = replay.replayHitDetection( context, transform, renderGeometryFunction, geometryCallback); if (result) { return result; @@ -1190,7 +1191,7 @@ ol.render.canvas.ReplayGroup.prototype.forEachGeometryAtCoordinate = function( var context = this.hitDetectionContext_; context.clearRect(0, 0, 1, 1); - return this.replayBackward_(zs, context, extent, transform, + return this.replayHitDetection_(zs, context, extent, transform, renderGeometryFunction, /** * @param {ol.geom.Geometry} geometry Geometry. From ac2a3cd1e8d48a56f2a7017345d254702e8fefa2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89ric=20Lemoine?= Date: Wed, 11 Dec 2013 15:51:42 +0100 Subject: [PATCH 4/5] Rename replayForward functions to replay --- src/ol/render/canvas/canvasreplay.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 79a254655c..4e343c025b 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -269,7 +269,7 @@ ol.render.canvas.Replay.prototype.replay_ = * @return {T|undefined} Callback result. * @template T */ -ol.render.canvas.Replay.prototype.replayForward = +ol.render.canvas.Replay.prototype.replay = function(context, transform, renderGeometryFunction) { var instructions = this.instructions; return this.replay_(context, transform, renderGeometryFunction, @@ -1094,7 +1094,7 @@ ol.render.canvas.ReplayGroup.prototype.replay = function(context, extent, /** @type {Array.} */ var zs = goog.array.map(goog.object.getKeys(this.replayesByZIndex_), Number); goog.array.sort(zs); - return this.replayForward_( + return this.replay_( zs, context, extent, transform, renderGeometryFunction); }; @@ -1144,7 +1144,7 @@ ol.render.canvas.ReplayGroup.prototype.replayHitDetection_ = * @return {T|undefined} Callback result. * @template T */ -ol.render.canvas.ReplayGroup.prototype.replayForward_ = +ol.render.canvas.ReplayGroup.prototype.replay_ = function(zs, context, extent, transform, renderGeometryFunction) { var i, ii, replayes, replayType, replay, result; for (i = 0, ii = zs.length; i < ii; ++i) { @@ -1152,7 +1152,7 @@ ol.render.canvas.ReplayGroup.prototype.replayForward_ = for (replayType in replayes) { replay = replayes[replayType]; if (ol.extent.intersects(extent, replay.getExtent())) { - result = replay.replayForward( + result = replay.replay( context, transform, renderGeometryFunction); if (result) { return result; From 829381fd43bc9c3df5425f2066ce97aba55f6890 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89ric=20Lemoine?= Date: Wed, 11 Dec 2013 16:14:25 +0100 Subject: [PATCH 5/5] Always fill polygons for hit detection --- src/ol/render/canvas/canvasreplay.js | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 4e343c025b..6dd3d24d89 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -858,10 +858,10 @@ ol.render.canvas.PolygonReplay.prototype.drawFlatCoordinatess_ = } // FIXME is it quicker to fill and stroke each polygon individually, // FIXME or all polygons together? + var fillInstruction = [ol.render.canvas.Instruction.FILL]; + this.hitDetectionInstructions.push(fillInstruction); if (goog.isDef(state.fillStyle)) { - var fillInstruction = [ol.render.canvas.Instruction.FILL]; this.instructions.push(fillInstruction); - this.hitDetectionInstructions.push(fillInstruction); } if (goog.isDef(state.strokeStyle)) { goog.asserts.assert(goog.isDef(state.lineWidth)); @@ -891,10 +891,10 @@ ol.render.canvas.PolygonReplay.prototype.drawPolygonGeometry = ol.extent.extend(this.extent_, polygonGeometry.getExtent()); this.setFillStrokeStyles_(); this.beginGeometry(polygonGeometry); - if (goog.isDef(state.fillStyle)) { - this.hitDetectionInstructions.push( - [ol.render.canvas.Instruction.SET_FILL_STYLE, state.fillStyle]); - } + // always fill the polygon for hit detection + this.hitDetectionInstructions.push( + [ol.render.canvas.Instruction.SET_FILL_STYLE, + ol.color.asString(ol.render.canvas.defaultFillStyle)]); if (goog.isDef(state.strokeStyle)) { this.hitDetectionInstructions.push( [ol.render.canvas.Instruction.SET_STROKE_STYLE, @@ -927,10 +927,10 @@ ol.render.canvas.PolygonReplay.prototype.drawMultiPolygonGeometry = ol.extent.extend(this.extent_, multiPolygonGeometry.getExtent()); this.setFillStrokeStyles_(); this.beginGeometry(multiPolygonGeometry); - if (goog.isDef(state.fillStyle)) { - this.hitDetectionInstructions.push( - [ol.render.canvas.Instruction.SET_FILL_STYLE, state.fillStyle]); - } + // always fill the multi-polygon for hit detection + this.hitDetectionInstructions.push( + [ol.render.canvas.Instruction.SET_FILL_STYLE, + ol.color.asString(ol.render.canvas.defaultFillStyle)]); if (goog.isDef(state.strokeStyle)) { this.hitDetectionInstructions.push( [ol.render.canvas.Instruction.SET_STROKE_STYLE,