diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 24d9e4306a..5d5cb33857 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -648,6 +648,7 @@ * @property {ol.Color|string|undefined} color Color. * @property {string|undefined} lineCap Line cap style: `butt`, `round`, or `square`. Default is `butt`. * @property {string|undefined} lineJoin Line join style: `bevel`, `round`, or `miter`. Default is `miter`. + * @property {number|undefined} miterLimit Miter limit. Default is `10`. * @property {number|undefined} width Width. * @todo stability experimental */ diff --git a/src/ol/render/canvas/canvas.js b/src/ol/render/canvas/canvas.js index 3be7a19957..942290074d 100644 --- a/src/ol/render/canvas/canvas.js +++ b/src/ol/render/canvas/canvas.js @@ -21,6 +21,12 @@ ol.render.canvas.defaultLineCap = 'butt'; ol.render.canvas.defaultLineJoin = 'miter'; +/** + * @const {number} + */ +ol.render.canvas.defaultMiterLimit = 10; + + /** * @const {ol.Color} */ diff --git a/src/ol/render/canvas/canvasimmediate.js b/src/ol/render/canvas/canvasimmediate.js index 3b85e6db0e..a3627517c3 100644 --- a/src/ol/render/canvas/canvasimmediate.js +++ b/src/ol/render/canvas/canvasimmediate.js @@ -47,6 +47,7 @@ ol.render.canvas.Immediate = function(context, extent, transform) { * currentLineCap: (string|undefined), * currentLineJoin: (string|undefined), * currentLineWidth: (number|undefined), + * currentMiterLimit: (number|undefined), * fillStyle: (string|undefined), * strokeStyle: (string|undefined), * lineWidth: (number|undefined), @@ -57,6 +58,7 @@ ol.render.canvas.Immediate = function(context, extent, transform) { * width: (number|undefined), * lineCap: (string|undefined), * lineJoin: (string|undefined), + * miterLimit: (number|undefined), * snapToPixel: (boolean|undefined), * textStyle: ol.style.Text}} */ @@ -66,6 +68,7 @@ ol.render.canvas.Immediate = function(context, extent, transform) { currentLineCap: undefined, currentLineJoin: undefined, currentLineWidth: undefined, + currentMiterLimit: undefined, fillStyle: undefined, strokeStyle: undefined, lineWidth: undefined, @@ -76,6 +79,7 @@ ol.render.canvas.Immediate = function(context, extent, transform) { width: undefined, lineCap: undefined, lineJoin: undefined, + miterLimit: undefined, snapToPixel: undefined, textStyle: null }; @@ -359,11 +363,14 @@ ol.render.canvas.Immediate.prototype.setFillStrokeStyle = strokeStyle.lineJoin : ol.render.canvas.defaultLineJoin; state.lineWidth = goog.isDef(strokeStyle.width) ? strokeStyle.width : ol.render.canvas.defaultLineWidth; + state.miterLimit = goog.isDef(strokeStyle.miterLimit) ? + strokeStyle.miterLimit : ol.render.canvas.defaultMiterLimit; } else { state.strokeStyle = undefined; state.lineCap = undefined; state.lineJoin = undefined; state.lineWidth = undefined; + state.miterLimit = undefined; } }; @@ -379,6 +386,7 @@ ol.render.canvas.Immediate.prototype.setFillStrokeStyles_ = function() { var lineCap = state.lineCap; var lineJoin = state.lineJoin; var lineWidth = state.lineWidth; + var miterLimit = state.miterLimit; if (goog.isDef(fillStyle) && state.currentFillStyle != fillStyle) { context.fillStyle = fillStyle; state.currentFillStyle = fillStyle; @@ -387,13 +395,16 @@ ol.render.canvas.Immediate.prototype.setFillStrokeStyles_ = function() { goog.asserts.assert(goog.isDef(lineWidth)); goog.asserts.assert(goog.isDef(lineCap)); goog.asserts.assert(goog.isDef(lineJoin)); + goog.asserts.assert(goog.isDef(miterLimit)); if (state.currentStrokeStyle != strokeStyle || state.currentLineCap != lineCap || state.currentLineJoin != lineJoin || + state.currentMiterLimit != miterLimit || state.currentLineWidth != lineWidth) { context.strokeStyle = strokeStyle; context.lineCap = lineCap; context.lineJoin = lineJoin; + context.miterLimit = miterLimit; context.lineWidth = lineWidth; } } diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 21ada5dcfb..fe5a74f6d4 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -191,10 +191,12 @@ ol.render.canvas.Replay.prototype.replay = goog.asserts.assert(goog.isNumber(instruction[2])); goog.asserts.assert(goog.isString(instruction[3])); goog.asserts.assert(goog.isString(instruction[4])); + goog.asserts.assert(goog.isNumber(instruction[5])); context.strokeStyle = /** @type {string} */ (instruction[1]); context.lineWidth = /** @type {number} */ (instruction[2]); context.lineCap = /** @type {string} */ (instruction[3]); context.lineJoin = /** @type {string} */ (instruction[4]); + context.miterLimit = /** @type {number} */ (instruction[5]); ++i; } else if (type == ol.render.canvas.Instruction.STROKE) { context.stroke(); @@ -463,22 +465,26 @@ ol.render.canvas.LineStringReplay = function() { * currentLineCap: (string|undefined), * currentLineJoin: (string|undefined), * currentLineWidth: (number|undefined), + * currentMiterLimit: (number|undefined), * lastStroke: number, * strokeStyle: (string|undefined), * lineCap: (string|undefined), * lineJoin: (string|undefined), - * lineWidth: (number|undefined)}|null} + * lineWidth: (number|undefined), + * miterLimit: (number|undefined)}|null} */ this.state_ = { currentStrokeStyle: undefined, currentLineCap: undefined, currentLineJoin: undefined, currentLineWidth: undefined, + currentMiterLimit: undefined, lastStroke: 0, strokeStyle: undefined, lineCap: undefined, lineJoin: undefined, - lineWidth: undefined + lineWidth: undefined, + miterLimit: undefined }; }; @@ -511,26 +517,30 @@ ol.render.canvas.LineStringReplay.prototype.setStrokeStyle_ = function() { var lineCap = state.lineCap; var lineJoin = state.lineJoin; var lineWidth = state.lineWidth; + var miterLimit = state.miterLimit; goog.asserts.assert(goog.isDef(strokeStyle)); goog.asserts.assert(goog.isDef(lineCap)); goog.asserts.assert(goog.isDef(lineJoin)); goog.asserts.assert(goog.isDef(lineWidth)); + goog.asserts.assert(goog.isDef(miterLimit)); if (state.currentStrokeStyle != strokeStyle || state.currentLineCap != lineCap || state.currentLineJoin != lineJoin || - state.currentLineWidth != lineWidth) { + state.currentLineWidth != lineWidth || + state.currentMiterLimit != miterLimit) { if (state.lastStroke != this.coordinates.length) { this.instructions.push([ol.render.canvas.Instruction.STROKE]); state.lastStroke = this.coordinates.length; } this.instructions.push( [ol.render.canvas.Instruction.SET_STROKE_STYLE, - strokeStyle, lineWidth, lineCap, lineJoin], + strokeStyle, lineWidth, lineCap, lineJoin, miterLimit], [ol.render.canvas.Instruction.BEGIN_PATH]); state.currentStrokeStyle = strokeStyle; state.currentLineCap = lineCap; state.currentLineJoin = lineJoin; state.currentLineWidth = lineWidth; + state.currentMiterLimit = miterLimit; } }; @@ -615,6 +625,8 @@ ol.render.canvas.LineStringReplay.prototype.setFillStrokeStyle = strokeStyle.lineJoin : ol.render.canvas.defaultLineJoin; this.state_.lineWidth = goog.isDef(strokeStyle.width) ? strokeStyle.width : ol.render.canvas.defaultLineWidth; + this.state_.miterLimit = goog.isDef(strokeStyle.miterLimit) ? + strokeStyle.miterLimit : ol.render.canvas.defaultMiterLimit; }; @@ -635,11 +647,13 @@ ol.render.canvas.PolygonReplay = function() { * currentLineCap: (string|undefined), * currentLineJoin: (string|undefined), * currentLineWidth: (number|undefined), + * currentMiterLimit: (number|undefined), * fillStyle: (string|undefined), * strokeStyle: (string|undefined), * lineCap: (string|undefined), * lineJoin: (string|undefined), - * lineWidth: (number|undefined)}|null} + * lineWidth: (number|undefined), + * miterLimit: (number|undefined)}|null} */ this.state_ = { currentFillStyle: undefined, @@ -647,11 +661,13 @@ ol.render.canvas.PolygonReplay = function() { currentLineCap: undefined, currentLineJoin: undefined, currentLineWidth: undefined, + currentMiterLimit: undefined, fillStyle: undefined, strokeStyle: undefined, lineCap: undefined, lineJoin: undefined, - lineWidth: undefined + lineWidth: undefined, + miterLimit: undefined }; }; @@ -782,11 +798,14 @@ ol.render.canvas.PolygonReplay.prototype.setFillStrokeStyle = strokeStyle.lineJoin : ol.render.canvas.defaultLineJoin; state.lineWidth = goog.isDef(strokeStyle.width) ? strokeStyle.width : ol.render.canvas.defaultLineWidth; + state.miterLimit = goog.isDef(strokeStyle.miterLimit) ? + strokeStyle.miterLimit : ol.render.canvas.defaultMiterLimit; } else { state.strokeStyle = undefined; state.lineCap = undefined; state.lineJoin = undefined; state.lineWidth = undefined; + state.miterLimit = undefined; } }; @@ -801,6 +820,7 @@ ol.render.canvas.PolygonReplay.prototype.setFillStrokeStyles_ = function() { var lineCap = state.lineCap; var lineJoin = state.lineJoin; var lineWidth = state.lineWidth; + var miterLimit = state.miterLimit; if (goog.isDef(fillStyle) && state.currentFillStyle != fillStyle) { this.instructions.push( [ol.render.canvas.Instruction.SET_FILL_STYLE, fillStyle]); @@ -810,17 +830,20 @@ ol.render.canvas.PolygonReplay.prototype.setFillStrokeStyles_ = function() { goog.asserts.assert(goog.isDef(lineCap)); goog.asserts.assert(goog.isDef(lineJoin)); goog.asserts.assert(goog.isDef(lineWidth)); + goog.asserts.assert(goog.isDef(miterLimit)); if (state.currentStrokeStyle != strokeStyle || state.currentLineCap != lineCap || state.currentLineJoin != lineJoin || - state.currentLineWidth != lineWidth) { + state.currentLineWidth != lineWidth || + state.currentMiterLimit != miterLimit) { this.instructions.push( [ol.render.canvas.Instruction.SET_STROKE_STYLE, - strokeStyle, lineWidth, lineCap, lineJoin]); + strokeStyle, lineWidth, lineCap, lineJoin, miterLimit]); state.currentStrokeStyle = strokeStyle; state.currentLineCap = lineCap; state.currentLineJoin = lineJoin; state.currentLineWidth = lineWidth; + state.currentMiterLimit = miterLimit; } } }; diff --git a/src/ol/style/strokestyle.js b/src/ol/style/strokestyle.js index 754aafee25..de485d4313 100644 --- a/src/ol/style/strokestyle.js +++ b/src/ol/style/strokestyle.js @@ -25,6 +25,11 @@ ol.style.Stroke = function(options) { */ this.lineJoin = options.lineJoin; + /** + * @type {number|undefined} + */ + this.miterLimit = options.miterLimit; + /** * @type {number|undefined} */