Apply pixelRatio to line dash

This commit is contained in:
Thomas Chandelle
2016-11-08 15:06:45 +01:00
parent f6a3ec513e
commit a0e310700c
4 changed files with 21 additions and 9 deletions

View File

@@ -129,7 +129,7 @@ ol.render.canvas.LineStringReplay.prototype.setStrokeStyle_ = function() {
} }
this.instructions.push([ this.instructions.push([
ol.render.canvas.Instruction.SET_STROKE_STYLE, ol.render.canvas.Instruction.SET_STROKE_STYLE,
strokeStyle, lineWidth, lineCap, lineJoin, miterLimit, lineDash strokeStyle, lineWidth, lineCap, lineJoin, miterLimit, lineDash, true, 1
], [ ], [
ol.render.canvas.Instruction.BEGIN_PATH ol.render.canvas.Instruction.BEGIN_PATH
]); ]);
@@ -159,7 +159,7 @@ ol.render.canvas.LineStringReplay.prototype.drawLineString = function(lineString
this.hitDetectionInstructions.push([ this.hitDetectionInstructions.push([
ol.render.canvas.Instruction.SET_STROKE_STYLE, ol.render.canvas.Instruction.SET_STROKE_STYLE,
state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin, state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin,
state.miterLimit, state.lineDash state.miterLimit, state.lineDash, true, 1
], [ ], [
ol.render.canvas.Instruction.BEGIN_PATH ol.render.canvas.Instruction.BEGIN_PATH
]); ]);
@@ -187,7 +187,7 @@ ol.render.canvas.LineStringReplay.prototype.drawMultiLineString = function(multi
this.hitDetectionInstructions.push([ this.hitDetectionInstructions.push([
ol.render.canvas.Instruction.SET_STROKE_STYLE, ol.render.canvas.Instruction.SET_STROKE_STYLE,
state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin, state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin,
state.miterLimit, state.lineDash state.miterLimit, state.lineDash, true, 1
], [ ], [
ol.render.canvas.Instruction.BEGIN_PATH ol.render.canvas.Instruction.BEGIN_PATH
]); ]);

View File

@@ -143,7 +143,7 @@ ol.render.canvas.PolygonReplay.prototype.drawCircle = function(circleGeometry, f
this.hitDetectionInstructions.push([ this.hitDetectionInstructions.push([
ol.render.canvas.Instruction.SET_STROKE_STYLE, ol.render.canvas.Instruction.SET_STROKE_STYLE,
state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin, state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin,
state.miterLimit, state.lineDash state.miterLimit, state.lineDash, true, 1
]); ]);
} }
var flatCoordinates = circleGeometry.getFlatCoordinates(); var flatCoordinates = circleGeometry.getFlatCoordinates();
@@ -195,7 +195,7 @@ ol.render.canvas.PolygonReplay.prototype.drawPolygon = function(polygonGeometry,
this.hitDetectionInstructions.push([ this.hitDetectionInstructions.push([
ol.render.canvas.Instruction.SET_STROKE_STYLE, ol.render.canvas.Instruction.SET_STROKE_STYLE,
state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin, state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin,
state.miterLimit, state.lineDash state.miterLimit, state.lineDash, true, 1
]); ]);
} }
var ends = polygonGeometry.getEnds(); var ends = polygonGeometry.getEnds();
@@ -232,7 +232,7 @@ ol.render.canvas.PolygonReplay.prototype.drawMultiPolygon = function(multiPolygo
this.hitDetectionInstructions.push([ this.hitDetectionInstructions.push([
ol.render.canvas.Instruction.SET_STROKE_STYLE, ol.render.canvas.Instruction.SET_STROKE_STYLE,
state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin, state.strokeStyle, state.lineWidth, state.lineCap, state.lineJoin,
state.miterLimit, state.lineDash state.miterLimit, state.lineDash, true, 1
]); ]);
} }
var endss = multiPolygonGeometry.getEndss(); var endss = multiPolygonGeometry.getEndss();
@@ -373,7 +373,7 @@ ol.render.canvas.PolygonReplay.prototype.setFillStrokeStyles_ = function(geometr
state.currentMiterLimit != miterLimit) { state.currentMiterLimit != miterLimit) {
this.instructions.push([ this.instructions.push([
ol.render.canvas.Instruction.SET_STROKE_STYLE, ol.render.canvas.Instruction.SET_STROKE_STYLE,
strokeStyle, lineWidth, lineCap, lineJoin, miterLimit, lineDash strokeStyle, lineWidth, lineCap, lineJoin, miterLimit, lineDash, true, 1
]); ]);
state.currentStrokeStyle = strokeStyle; state.currentStrokeStyle = strokeStyle;
state.currentLineCap = lineCap; state.currentLineCap = lineCap;

View File

@@ -512,8 +512,12 @@ ol.render.canvas.Replay.prototype.replay_ = function(
'6th instruction should be a number'); '6th instruction should be a number');
ol.DEBUG && console.assert(instruction[6], ol.DEBUG && console.assert(instruction[6],
'7th instruction should not be null'); '7th instruction should not be null');
ol.DEBUG && console.assert(typeof instruction[8] === 'number',
'9th instruction should be a number');
var usePixelRatio = instruction[7] !== undefined ? var usePixelRatio = instruction[7] !== undefined ?
instruction[7] : true; instruction[7] : true;
var renderedPixelRatio = instruction[8];
var lineWidth = /** @type {number} */ (instruction[2]); var lineWidth = /** @type {number} */ (instruction[2]);
if (pendingStroke) { if (pendingStroke) {
context.stroke(); context.stroke();
@@ -525,7 +529,15 @@ ol.render.canvas.Replay.prototype.replay_ = function(
context.lineJoin = /** @type {string} */ (instruction[4]); context.lineJoin = /** @type {string} */ (instruction[4]);
context.miterLimit = /** @type {number} */ (instruction[5]); context.miterLimit = /** @type {number} */ (instruction[5]);
if (ol.has.CANVAS_LINE_DASH) { if (ol.has.CANVAS_LINE_DASH) {
context.setLineDash(/** @type {Array.<number>} */ (instruction[6])); var lineDash = /** @type {Array.<number>} */ (instruction[6]);
if (usePixelRatio && pixelRatio !== renderedPixelRatio) {
lineDash = lineDash.map(function(dash) {
return dash * pixelRatio / renderedPixelRatio;
});
instruction[6] = lineDash;
instruction[8] = pixelRatio;
}
context.setLineDash(lineDash);
} }
prevX = NaN; prevX = NaN;
prevY = NaN; prevY = NaN;

View File

@@ -169,7 +169,7 @@ ol.render.canvas.TextReplay.prototype.setReplayStrokeState_ = function(strokeSta
var setStrokeStyleInstruction = [ var setStrokeStyleInstruction = [
ol.render.canvas.Instruction.SET_STROKE_STYLE, strokeState.strokeStyle, ol.render.canvas.Instruction.SET_STROKE_STYLE, strokeState.strokeStyle,
strokeState.lineWidth, strokeState.lineCap, strokeState.lineJoin, strokeState.lineWidth, strokeState.lineCap, strokeState.lineJoin,
strokeState.miterLimit, strokeState.lineDash, false strokeState.miterLimit, strokeState.lineDash, false, 1
]; ];
this.instructions.push(setStrokeStyleInstruction); this.instructions.push(setStrokeStyleInstruction);
this.hitDetectionInstructions.push(setStrokeStyleInstruction); this.hitDetectionInstructions.push(setStrokeStyleInstruction);