Merge pull request #296 from ajkopinga/canvas-edge-hit2
added hit detection for symbol edges to canvas renderer with unit tests
This commit is contained in:
@@ -322,6 +322,11 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
|
||||
this.canvas.lineCap = "round";
|
||||
this.canvas.lineJoin = "round";
|
||||
|
||||
if (this.hitDetection) {
|
||||
this.hitContext.lineCap = "round";
|
||||
this.hitContext.lineJoin = "round";
|
||||
}
|
||||
|
||||
// Scale and rotate symbols, using precalculated bounds whenever possible.
|
||||
if (style.graphicName in this.cachedSymbolBounds) {
|
||||
symbolBounds = this.cachedSymbolBounds[style.graphicName];
|
||||
@@ -393,9 +398,7 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
|
||||
|
||||
if (style.stroke !== false) {
|
||||
this.setCanvasStyle("stroke", style);
|
||||
|
||||
this.canvas.beginPath();
|
||||
|
||||
for (i=0; i<symbol.length; i=i+2) {
|
||||
x = symbol[i];
|
||||
y = symbol[i+1];
|
||||
@@ -404,6 +407,21 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
|
||||
}
|
||||
this.canvas.closePath();
|
||||
this.canvas.stroke();
|
||||
|
||||
|
||||
if (this.hitDetection) {
|
||||
this.setHitContextStyle("stroke", featureId, style, scaling);
|
||||
this.hitContext.beginPath();
|
||||
for (i=0; i<symbol.length; i=i+2) {
|
||||
x = symbol[i];
|
||||
y = symbol[i+1];
|
||||
if (i == 0) this.hitContext.moveTo(x,y);
|
||||
this.hitContext.lineTo(x,y);
|
||||
}
|
||||
this.hitContext.closePath();
|
||||
this.hitContext.stroke();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
style.strokeWidth = unscaledStrokeWidth;
|
||||
@@ -465,7 +483,7 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
|
||||
* featureId - {String} The feature id.
|
||||
* symbolizer - {<OpenLayers.Symbolizer>} The symbolizer.
|
||||
*/
|
||||
setHitContextStyle: function(type, featureId, symbolizer) {
|
||||
setHitContextStyle: function(type, featureId, symbolizer, strokeScaling) {
|
||||
var hex = this.featureIdToHex(featureId);
|
||||
if (type == "fill") {
|
||||
this.hitContext.globalAlpha = 1.0;
|
||||
@@ -473,8 +491,13 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
|
||||
} else if (type == "stroke") {
|
||||
this.hitContext.globalAlpha = 1.0;
|
||||
this.hitContext.strokeStyle = hex;
|
||||
// bump up stroke width to deal with antialiasing
|
||||
this.hitContext.lineWidth = symbolizer.strokeWidth + 2;
|
||||
// bump up stroke width to deal with antialiasing. If strokeScaling is defined, we're rendering a symbol
|
||||
// on a transformed canvas, so the antialias width bump has to scale as well.
|
||||
if (typeof strokeScaling === "undefined") {
|
||||
this.hitContext.lineWidth = symbolizer.strokeWidth + 2;
|
||||
} else {
|
||||
if (!isNaN(strokeScaling)) { this.hitContext.lineWidth = symbolizer.strokeWidth + 2.0 / strokeScaling; }
|
||||
}
|
||||
} else {
|
||||
this.hitContext.globalAlpha = 0;
|
||||
this.hitContext.lineWidth = 1;
|
||||
|
||||
Reference in New Issue
Block a user