From faee18bae1731f1e51772cb1eca437288af23677 Mon Sep 17 00:00:00 2001 From: Tim Schaub Date: Thu, 7 Mar 2013 22:51:14 -0700 Subject: [PATCH] Use fillColor and strokeColor instead of fillStyle and strokeStyle The color names are more intuitive. And if we want to support pattern strokes or fills, we'll need additional proerties to represent other pattern properties. --- src/objectliterals.exports | 10 +-- src/ol/renderer/canvas/canvasrenderer.js | 36 +++++----- src/ol/style/line.js | 24 +++---- src/ol/style/polygon.js | 76 ++++++++++----------- src/ol/style/shape.js | 84 ++++++++++++------------ test/spec/ol/layer/vectorlayer.test.js | 10 +-- test/spec/ol/style/line.test.js | 8 +-- test/spec/ol/style/polygon.test.js | 30 ++++----- test/spec/ol/style/shape.test.js | 28 ++++---- test/spec/ol/style/style.test.js | 4 +- 10 files changed, 156 insertions(+), 154 deletions(-) diff --git a/src/objectliterals.exports b/src/objectliterals.exports index dae5ee0510..3d793c1f25 100644 --- a/src/objectliterals.exports +++ b/src/objectliterals.exports @@ -151,13 +151,13 @@ @exportObjectLiteralProperty ol.style.IconOptions.rotation number|ol.Expression|undefined @exportObjectLiteral ol.style.LineOptions -@exportObjectLiteralProperty ol.style.LineOptions.strokeStyle string|ol.Expression|undefined +@exportObjectLiteralProperty ol.style.LineOptions.strokeColor string|ol.Expression|undefined @exportObjectLiteralProperty ol.style.LineOptions.strokeWidth number|ol.Expression|undefined @exportObjectLiteralProperty ol.style.LineOptions.opacity number|ol.Expression|undefined @exportObjectLiteral ol.style.PolygonOptions -@exportObjectLiteralProperty ol.style.PolygonOptions.fillStyle string|ol.Expression|undefined -@exportObjectLiteralProperty ol.style.PolygonOptions.strokeStyle string|ol.Expression|undefined +@exportObjectLiteralProperty ol.style.PolygonOptions.fillColor string|ol.Expression|undefined +@exportObjectLiteralProperty ol.style.PolygonOptions.strokeColor string|ol.Expression|undefined @exportObjectLiteralProperty ol.style.PolygonOptions.strokeWidth number|ol.Expression|undefined @exportObjectLiteralProperty ol.style.PolygonOptions.opacity number|ol.Expression|undefined @@ -168,8 +168,8 @@ @exportObjectLiteral ol.style.ShapeOptions @exportObjectLiteralProperty ol.style.ShapeOptions.type ol.style.ShapeType|undefined @exportObjectLiteralProperty ol.style.ShapeOptions.size number|ol.Expression|undefined -@exportObjectLiteralProperty ol.style.ShapeOptions.fillStyle string|ol.Expression|undefined -@exportObjectLiteralProperty ol.style.ShapeOptions.strokeStyle string|ol.Expression|undefined +@exportObjectLiteralProperty ol.style.ShapeOptions.fillColor string|ol.Expression|undefined +@exportObjectLiteralProperty ol.style.ShapeOptions.strokeColor string|ol.Expression|undefined @exportObjectLiteralProperty ol.style.ShapeOptions.strokeWidth number|ol.Expression|undefined @exportObjectLiteralProperty ol.style.ShapeOptions.opacity number|ol.Expression|undefined diff --git a/src/ol/renderer/canvas/canvasrenderer.js b/src/ol/renderer/canvas/canvasrenderer.js index ced16ffba2..4899aa5e18 100644 --- a/src/ol/renderer/canvas/canvasrenderer.js +++ b/src/ol/renderer/canvas/canvasrenderer.js @@ -137,7 +137,7 @@ ol.renderer.canvas.Renderer.prototype.renderLineStringFeatures_ = i, ii, geometry, components, j, jj, line, dim, k, kk, x, y; context.globalAlpha = symbolizer.opacity; - context.strokeStyle = symbolizer.strokeStyle; + context.strokeStyle = symbolizer.strokeColor; context.lineWidth = symbolizer.strokeWidth * this.inverseScale_; context.lineCap = 'round'; // TODO: accept this as a symbolizer property context.lineJoin = 'round'; // TODO: accept this as a symbolizer property @@ -232,20 +232,20 @@ ol.renderer.canvas.Renderer.prototype.renderPointFeatures_ = ol.renderer.canvas.Renderer.prototype.renderPolygonFeatures_ = function(features, symbolizer) { var context = this.context_, - strokeStyle = symbolizer.strokeStyle, - fillStyle = symbolizer.fillStyle, + strokeColor = symbolizer.strokeColor, + fillColor = symbolizer.fillColor, i, ii, geometry, components, j, jj, poly, rings, numRings, ring, dim, k, kk, x, y; context.globalAlpha = symbolizer.opacity; - if (strokeStyle) { - context.strokeStyle = symbolizer.strokeStyle; + if (strokeColor) { + context.strokeStyle = symbolizer.strokeColor; context.lineWidth = symbolizer.strokeWidth * this.inverseScale_; context.lineCap = 'round'; // TODO: accept this as a symbolizer property context.lineJoin = 'round'; // TODO: accept this as a symbolizer property } - if (fillStyle) { - context.fillStyle = fillStyle; + if (fillColor) { + context.fillStyle = fillColor; } /** @@ -282,7 +282,7 @@ ol.renderer.canvas.Renderer.prototype.renderPolygonFeatures_ = context.lineTo(x, y); } } - if (fillStyle && strokeStyle) { + if (fillColor && strokeColor) { // scenario 3 - fill and stroke each time context.fill(); context.stroke(); @@ -293,8 +293,8 @@ ol.renderer.canvas.Renderer.prototype.renderPolygonFeatures_ = } } } - if (!(fillStyle && strokeStyle)) { - if (fillStyle) { + if (!(fillColor && strokeColor)) { + if (fillColor) { // scenario 2 - fill all at once context.fill(); } else { @@ -318,8 +318,8 @@ ol.renderer.canvas.Renderer.renderCircle_ = function(circle) { (goog.dom.createElement(goog.dom.TagName.CANVAS)), context = /** @type {CanvasRenderingContext2D} */ (canvas.getContext('2d')), - fillStyle = circle.fillStyle, - strokeStyle = circle.strokeStyle, + fillColor = circle.fillColor, + strokeColor = circle.strokeColor, twoPi = Math.PI * 2; canvas.height = size; @@ -327,12 +327,12 @@ ol.renderer.canvas.Renderer.renderCircle_ = function(circle) { context.globalAlpha = circle.opacity; - if (fillStyle) { - context.fillStyle = fillStyle; + if (fillColor) { + context.fillStyle = fillColor; } - if (strokeStyle) { + if (strokeColor) { context.lineWidth = strokeWidth; - context.strokeStyle = strokeStyle; + context.strokeStyle = strokeColor; context.lineCap = 'round'; // TODO: accept this as a symbolizer property context.lineJoin = 'round'; // TODO: accept this as a symbolizer property } @@ -340,10 +340,10 @@ ol.renderer.canvas.Renderer.renderCircle_ = function(circle) { context.beginPath(); context.arc(mid, mid, circle.size / 2, 0, twoPi, true); - if (fillStyle) { + if (fillColor) { context.fill(); } - if (strokeStyle) { + if (strokeColor) { context.stroke(); } return canvas; diff --git a/src/ol/style/line.js b/src/ol/style/line.js index c9ae263b6d..340181a256 100644 --- a/src/ol/style/line.js +++ b/src/ol/style/line.js @@ -8,7 +8,7 @@ goog.require('ol.style.SymbolizerLiteral'); /** - * @typedef {{strokeStyle: (string), + * @typedef {{strokeColor: (string), * strokeWidth: (number), * opacity: (number)}} */ @@ -24,9 +24,9 @@ ol.style.LineLiteralOptions; ol.style.LineLiteral = function(config) { goog.base(this); - goog.asserts.assertString(config.strokeStyle, 'strokeStyle must be a string'); + goog.asserts.assertString(config.strokeColor, 'strokeColor must be a string'); /** @type {string} */ - this.strokeStyle = config.strokeStyle; + this.strokeColor = config.strokeColor; goog.asserts.assertNumber(config.strokeWidth, 'strokeWidth must be a number'); /** @type {number} */ @@ -44,7 +44,7 @@ goog.inherits(ol.style.LineLiteral, ol.style.SymbolizerLiteral); * @inheritDoc */ ol.style.LineLiteral.prototype.equals = function(lineLiteral) { - return this.strokeStyle == lineLiteral.strokeStyle && + return this.strokeColor == lineLiteral.strokeColor && this.strokeWidth == lineLiteral.strokeWidth && this.opacity == lineLiteral.opacity; }; @@ -63,10 +63,10 @@ ol.style.Line = function(options) { * @type {ol.Expression} * @private */ - this.strokeStyle_ = !goog.isDef(options.strokeStyle) ? - new ol.ExpressionLiteral(ol.style.LineDefaults.strokeStyle) : - (options.strokeStyle instanceof ol.Expression) ? - options.strokeStyle : new ol.ExpressionLiteral(options.strokeStyle); + this.strokeColor_ = !goog.isDef(options.strokeColor) ? + new ol.ExpressionLiteral(ol.style.LineDefaults.strokeColor) : + (options.strokeColor instanceof ol.Expression) ? + options.strokeColor : new ol.ExpressionLiteral(options.strokeColor); /** * @type {ol.Expression} @@ -101,8 +101,8 @@ ol.style.Line.prototype.createLiteral = function(opt_feature) { attrs = feature.getAttributes(); } - var strokeStyle = this.strokeStyle_.evaluate(feature, attrs); - goog.asserts.assertString(strokeStyle, 'strokeStyle must be a string'); + var strokeColor = this.strokeColor_.evaluate(feature, attrs); + goog.asserts.assertString(strokeColor, 'strokeColor must be a string'); var strokeWidth = this.strokeWidth_.evaluate(feature, attrs); goog.asserts.assertNumber(strokeWidth, 'strokeWidth must be a number'); @@ -111,7 +111,7 @@ ol.style.Line.prototype.createLiteral = function(opt_feature) { goog.asserts.assertNumber(opacity, 'opacity must be a number'); return new ol.style.LineLiteral({ - strokeStyle: strokeStyle, + strokeColor: strokeColor, strokeWidth: strokeWidth, opacity: opacity }); @@ -122,7 +122,7 @@ ol.style.Line.prototype.createLiteral = function(opt_feature) { * @type {ol.style.LineLiteral} */ ol.style.LineDefaults = new ol.style.LineLiteral({ - strokeStyle: '#696969', + strokeColor: '#696969', strokeWidth: 1.5, opacity: 0.75 }); diff --git a/src/ol/style/polygon.js b/src/ol/style/polygon.js index bb0a49a168..ef2a017ec1 100644 --- a/src/ol/style/polygon.js +++ b/src/ol/style/polygon.js @@ -8,8 +8,8 @@ goog.require('ol.style.SymbolizerLiteral'); /** - * @typedef {{fillStyle: (string|undefined), - * strokeStyle: (string|undefined), + * @typedef {{fillColor: (string|undefined), + * strokeColor: (string|undefined), * strokeWidth: (number|undefined), * opacity: (number)}} */ @@ -26,16 +26,16 @@ ol.style.PolygonLiteral = function(config) { goog.base(this); /** @type {string|undefined} */ - this.fillStyle = config.fillStyle; - if (goog.isDef(config.fillStyle)) { - goog.asserts.assertString(config.fillStyle, 'fillStyle must be a string'); + this.fillColor = config.fillColor; + if (goog.isDef(config.fillColor)) { + goog.asserts.assertString(config.fillColor, 'fillColor must be a string'); } /** @type {string|undefined} */ - this.strokeStyle = config.strokeStyle; - if (goog.isDef(this.strokeStyle)) { + this.strokeColor = config.strokeColor; + if (goog.isDef(this.strokeColor)) { goog.asserts.assertString( - this.strokeStyle, 'strokeStyle must be a string'); + this.strokeColor, 'strokeColor must be a string'); } /** @type {number|undefined} */ @@ -46,9 +46,9 @@ ol.style.PolygonLiteral = function(config) { } goog.asserts.assert( - goog.isDef(this.fillStyle) || - (goog.isDef(this.strokeStyle) && goog.isDef(this.strokeWidth)), - 'Either fillStyle or strokeStyle and strokeWidth must be set'); + goog.isDef(this.fillColor) || + (goog.isDef(this.strokeColor) && goog.isDef(this.strokeWidth)), + 'Either fillColor or strokeColor and strokeWidth must be set'); goog.asserts.assertNumber(config.opacity, 'opacity must be a number'); /** @type {number} */ @@ -62,8 +62,8 @@ goog.inherits(ol.style.PolygonLiteral, ol.style.SymbolizerLiteral); * @inheritDoc */ ol.style.PolygonLiteral.prototype.equals = function(polygonLiteral) { - return this.fillStyle == polygonLiteral.fillStyle && - this.strokeStyle == polygonLiteral.strokeStyle && + return this.fillColor == polygonLiteral.fillColor && + this.strokeColor == polygonLiteral.strokeColor && this.strokeWidth == polygonLiteral.strokeWidth && this.opacity == polygonLiteral.opacity; }; @@ -82,22 +82,22 @@ ol.style.Polygon = function(options) { * @type {ol.Expression} * @private */ - this.fillStyle_ = !goog.isDefAndNotNull(options.fillStyle) ? + this.fillColor_ = !goog.isDefAndNotNull(options.fillColor) ? null : - (options.fillStyle instanceof ol.Expression) ? - options.fillStyle : new ol.ExpressionLiteral(options.fillStyle); + (options.fillColor instanceof ol.Expression) ? + options.fillColor : new ol.ExpressionLiteral(options.fillColor); // stroke handling - if any stroke property is supplied, use defaults - var strokeStyle = null, + var strokeColor = null, strokeWidth = null; - if (goog.isDefAndNotNull(options.strokeStyle) || + if (goog.isDefAndNotNull(options.strokeColor) || goog.isDefAndNotNull(options.strokeWidth)) { - strokeStyle = !goog.isDefAndNotNull(options.strokeStyle) ? - new ol.ExpressionLiteral(ol.style.PolygonDefaults.strokeStyle) : - (options.strokeStyle instanceof ol.Expression) ? - options.strokeStyle : new ol.ExpressionLiteral(options.strokeStyle); + strokeColor = !goog.isDefAndNotNull(options.strokeColor) ? + new ol.ExpressionLiteral(ol.style.PolygonDefaults.strokeColor) : + (options.strokeColor instanceof ol.Expression) ? + options.strokeColor : new ol.ExpressionLiteral(options.strokeColor); strokeWidth = !goog.isDef(options.strokeWidth) ? new ol.ExpressionLiteral(ol.style.PolygonDefaults.strokeWidth) : @@ -109,7 +109,7 @@ ol.style.Polygon = function(options) { * @type {ol.Expression} * @private */ - this.strokeStyle_ = strokeStyle; + this.strokeColor_ = strokeColor; /** * @type {ol.Expression} @@ -118,8 +118,8 @@ ol.style.Polygon = function(options) { this.strokeWidth_ = strokeWidth; // one of stroke or fill can be null, both null is user error - goog.asserts.assert(!goog.isNull(this.fillStyle_) || - !(goog.isNull(this.strokeStyle_) && goog.isNull(this.strokeWidth_)), + goog.asserts.assert(!goog.isNull(this.fillColor_) || + !(goog.isNull(this.strokeColor_) && goog.isNull(this.strokeWidth_)), 'Stroke or fill properties must be provided'); /** @@ -146,15 +146,15 @@ ol.style.Polygon.prototype.createLiteral = function(opt_feature) { attrs = feature.getAttributes(); } - var fillStyle = goog.isNull(this.fillStyle_) ? + var fillColor = goog.isNull(this.fillColor_) ? undefined : - /** @type {string} */ (this.fillStyle_.evaluate(feature, attrs)); - goog.asserts.assert(!goog.isDef(fillStyle) || goog.isString(fillStyle)); + /** @type {string} */ (this.fillColor_.evaluate(feature, attrs)); + goog.asserts.assert(!goog.isDef(fillColor) || goog.isString(fillColor)); - var strokeStyle = goog.isNull(this.strokeStyle_) ? + var strokeColor = goog.isNull(this.strokeColor_) ? undefined : - /** @type {string} */ (this.strokeStyle_.evaluate(feature, attrs)); - goog.asserts.assert(!goog.isDef(strokeStyle) || goog.isString(strokeStyle)); + /** @type {string} */ (this.strokeColor_.evaluate(feature, attrs)); + goog.asserts.assert(!goog.isDef(strokeColor) || goog.isString(strokeColor)); var strokeWidth = goog.isNull(this.strokeWidth_) ? undefined : @@ -162,16 +162,16 @@ ol.style.Polygon.prototype.createLiteral = function(opt_feature) { goog.asserts.assert(!goog.isDef(strokeWidth) || goog.isNumber(strokeWidth)); goog.asserts.assert( - goog.isDef(fillStyle) || - (goog.isDef(strokeStyle) && goog.isDef(strokeWidth)), - 'either fill style or strokeStyle and strokeWidth must be defined'); + goog.isDef(fillColor) || + (goog.isDef(strokeColor) && goog.isDef(strokeWidth)), + 'either fill style or strokeColor and strokeWidth must be defined'); var opacity = this.opacity_.evaluate(feature, attrs); goog.asserts.assertNumber(opacity, 'opacity must be a number'); return new ol.style.PolygonLiteral({ - fillStyle: fillStyle, - strokeStyle: strokeStyle, + fillColor: fillColor, + strokeColor: strokeColor, strokeWidth: strokeWidth, opacity: opacity }); @@ -182,8 +182,8 @@ ol.style.Polygon.prototype.createLiteral = function(opt_feature) { * @type {ol.style.PolygonLiteral} */ ol.style.PolygonDefaults = new ol.style.PolygonLiteral({ - fillStyle: '#ffffff', - strokeStyle: '#696969', + fillColor: '#ffffff', + strokeColor: '#696969', strokeWidth: 1.5, opacity: 0.75 }); diff --git a/src/ol/style/shape.js b/src/ol/style/shape.js index bb15a0665b..d0af55a4d1 100644 --- a/src/ol/style/shape.js +++ b/src/ol/style/shape.js @@ -19,8 +19,8 @@ ol.style.ShapeType = { /** * @typedef {{type: (ol.style.ShapeType), * size: (number), - * fillStyle: (string|undefined), - * strokeStyle: (string|undefined), + * fillColor: (string|undefined), + * strokeColor: (string|undefined), * strokeWidth: (number|undefined), * opacity: (number)}} */ @@ -44,16 +44,16 @@ ol.style.ShapeLiteral = function(config) { this.size = config.size; /** @type {string|undefined} */ - this.fillStyle = config.fillStyle; - if (goog.isDef(config.fillStyle)) { - goog.asserts.assertString(config.fillStyle, 'fillStyle must be a string'); + this.fillColor = config.fillColor; + if (goog.isDef(config.fillColor)) { + goog.asserts.assertString(config.fillColor, 'fillColor must be a string'); } /** @type {string|undefined} */ - this.strokeStyle = config.strokeStyle; - if (goog.isDef(this.strokeStyle)) { + this.strokeColor = config.strokeColor; + if (goog.isDef(this.strokeColor)) { goog.asserts.assertString( - this.strokeStyle, 'strokeStyle must be a string'); + this.strokeColor, 'strokeColor must be a string'); } /** @type {number|undefined} */ @@ -64,9 +64,9 @@ ol.style.ShapeLiteral = function(config) { } goog.asserts.assert( - goog.isDef(this.fillStyle) || - (goog.isDef(this.strokeStyle) && goog.isDef(this.strokeWidth)), - 'Either fillStyle or strokeStyle and strokeWidth must be set'); + goog.isDef(this.fillColor) || + (goog.isDef(this.strokeColor) && goog.isDef(this.strokeWidth)), + 'Either fillColor or strokeColor and strokeWidth must be set'); goog.asserts.assertNumber(config.opacity, 'opacity must be a number'); /** @type {number} */ @@ -82,8 +82,8 @@ goog.inherits(ol.style.ShapeLiteral, ol.style.PointLiteral); ol.style.ShapeLiteral.prototype.equals = function(shapeLiteral) { return this.type == shapeLiteral.type && this.size == shapeLiteral.size && - this.fillStyle == shapeLiteral.fillStyle && - this.strokeStyle == shapeLiteral.strokeStyle && + this.fillColor == shapeLiteral.fillColor && + this.strokeColor == shapeLiteral.strokeColor && this.strokeWidth == shapeLiteral.strokeWidth && this.opacity == shapeLiteral.opacity; }; @@ -117,22 +117,22 @@ ol.style.Shape = function(options) { * @type {ol.Expression} * @private */ - this.fillStyle_ = !goog.isDefAndNotNull(options.fillStyle) ? + this.fillColor_ = !goog.isDefAndNotNull(options.fillColor) ? null : - (options.fillStyle instanceof ol.Expression) ? - options.fillStyle : new ol.ExpressionLiteral(options.fillStyle); + (options.fillColor instanceof ol.Expression) ? + options.fillColor : new ol.ExpressionLiteral(options.fillColor); // stroke handling - if any stroke property is supplied, use defaults - var strokeStyle = null, + var strokeColor = null, strokeWidth = null; - if (goog.isDefAndNotNull(options.strokeStyle) || + if (goog.isDefAndNotNull(options.strokeColor) || goog.isDefAndNotNull(options.strokeWidth)) { - strokeStyle = !goog.isDefAndNotNull(options.strokeStyle) ? - new ol.ExpressionLiteral(ol.style.ShapeDefaults.strokeStyle) : - (options.strokeStyle instanceof ol.Expression) ? - options.strokeStyle : new ol.ExpressionLiteral(options.strokeStyle); + strokeColor = !goog.isDefAndNotNull(options.strokeColor) ? + new ol.ExpressionLiteral(ol.style.ShapeDefaults.strokeColor) : + (options.strokeColor instanceof ol.Expression) ? + options.strokeColor : new ol.ExpressionLiteral(options.strokeColor); strokeWidth = !goog.isDef(options.strokeWidth) ? new ol.ExpressionLiteral(ol.style.ShapeDefaults.strokeWidth) : @@ -144,7 +144,7 @@ ol.style.Shape = function(options) { * @type {ol.Expression} * @private */ - this.strokeStyle_ = strokeStyle; + this.strokeColor_ = strokeColor; /** * @type {ol.Expression} @@ -153,8 +153,8 @@ ol.style.Shape = function(options) { this.strokeWidth_ = strokeWidth; // one of stroke or fill can be null, both null is user error - goog.asserts.assert(!goog.isNull(this.fillStyle_) || - !(goog.isNull(this.strokeStyle_) && goog.isNull(this.strokeWidth_)), + goog.asserts.assert(!goog.isNull(this.fillColor_) || + !(goog.isNull(this.strokeColor_) && goog.isNull(this.strokeWidth_)), 'Stroke or fill properties must be provided'); /** @@ -183,22 +183,25 @@ ol.style.Shape.prototype.createLiteral = function(opt_feature) { var size = this.size_.evaluate(feature, attrs); goog.asserts.assertNumber(size, 'size must be a number'); - var fillStyle = goog.isNull(this.fillStyle_) ? - undefined : this.fillStyle_.evaluate(feature, attrs); - goog.asserts.assert(!goog.isDef(fillStyle) || goog.isString(fillStyle)); + var fillColor = goog.isNull(this.fillColor_) ? + undefined : + /** @type {string} */ (this.fillColor_.evaluate(feature, attrs)); + goog.asserts.assert(!goog.isDef(fillColor) || goog.isString(fillColor)); - var strokeStyle = goog.isNull(this.strokeStyle_) ? - undefined : this.strokeStyle_.evaluate(feature, attrs); - goog.asserts.assert(!goog.isDef(strokeStyle) || goog.isString(strokeStyle)); + var strokeColor = goog.isNull(this.strokeColor_) ? + undefined : + /** @type {string} */ (this.strokeColor_.evaluate(feature, attrs)); + goog.asserts.assert(!goog.isDef(strokeColor) || goog.isString(strokeColor)); var strokeWidth = goog.isNull(this.strokeWidth_) ? - undefined : this.strokeWidth_.evaluate(feature, attrs); + undefined : + /** @type {number} */ (this.strokeWidth_.evaluate(feature, attrs)); goog.asserts.assert(!goog.isDef(strokeWidth) || goog.isNumber(strokeWidth)); goog.asserts.assert( - goog.isDef(fillStyle) || - (goog.isDef(strokeStyle) && goog.isDef(strokeWidth)), - 'either fill style or strokeStyle and strokeWidth must be defined'); + goog.isDef(fillColor) || + (goog.isDef(strokeColor) && goog.isDef(strokeWidth)), + 'either fill style or strokeColor and strokeWidth must be defined'); var opacity = this.opacity_.evaluate(feature, attrs); goog.asserts.assertNumber(opacity, 'opacity must be a number'); @@ -206,10 +209,9 @@ ol.style.Shape.prototype.createLiteral = function(opt_feature) { return new ol.style.ShapeLiteral({ type: this.type_, size: size, - // TODO: check if typecast can be avoided here - fillStyle: /** @type {string|undefined} */ (fillStyle), - strokeStyle: /** @type {string|undefined} */ (strokeStyle), - strokeWidth: /** @type {number|undefined} */ (strokeWidth), + fillColor: fillColor, + strokeColor: strokeColor, + strokeWidth: strokeWidth, opacity: opacity }); }; @@ -221,8 +223,8 @@ ol.style.Shape.prototype.createLiteral = function(opt_feature) { ol.style.ShapeDefaults = new ol.style.ShapeLiteral({ type: ol.style.ShapeType.CIRCLE, size: 5, - fillStyle: '#ffffff', - strokeStyle: '#696969', + fillColor: '#ffffff', + strokeColor: '#696969', strokeWidth: 1.5, opacity: 0.75 }); diff --git a/test/spec/ol/layer/vectorlayer.test.js b/test/spec/ol/layer/vectorlayer.test.js index f63402c935..40640fdc07 100644 --- a/test/spec/ol/layer/vectorlayer.test.js +++ b/test/spec/ol/layer/vectorlayer.test.js @@ -107,7 +107,7 @@ describe('ol.layer.Vector', function() { symbolizers: [ new ol.style.Line({ strokeWidth: 2, - strokeStyle: new ol.Expression('colorProperty'), + strokeColor: new ol.Expression('colorProperty'), opacity: 1 }) ] @@ -136,20 +136,20 @@ describe('ol.layer.Vector', function() { var groups = layer.groupFeaturesBySymbolizerLiteral(features); expect(groups.length).toBe(2); expect(groups[0][0].length).toBe(1); - expect(groups[0][1].strokeStyle).toBe('#BADA55'); + expect(groups[0][1].strokeColor).toBe('#BADA55'); expect(groups[1][0].length).toBe(2); - expect(groups[1][1].strokeStyle).toBe('#013'); + expect(groups[1][1].strokeColor).toBe('#013'); }); it('groups equal symbolizers also when defined on features', function() { var symbolizer = new ol.style.Line({ strokeWidth: 3, - strokeStyle: new ol.Expression('colorProperty'), + strokeColor: new ol.Expression('colorProperty'), opacity: 1 }); var anotherSymbolizer = new ol.style.Line({ strokeWidth: 3, - strokeStyle: '#BADA55', + strokeColor: '#BADA55', opacity: 1 }); var featureWithSymbolizers = new ol.Feature({ diff --git a/test/spec/ol/style/line.test.js b/test/spec/ol/style/line.test.js index 95784ab15f..4100652a7d 100644 --- a/test/spec/ol/style/line.test.js +++ b/test/spec/ol/style/line.test.js @@ -7,16 +7,16 @@ describe('ol.style.LineLiteral', function() { it('identifies equal literals', function() { var literal = new ol.style.LineLiteral({ strokeWidth: 3, - strokeStyle: '#BADA55', + strokeColor: '#BADA55', opacity: 1 }); var equalLiteral = new ol.style.LineLiteral({ - strokeStyle: '#BADA55', + strokeColor: '#BADA55', strokeWidth: 3, opacity: 1 }); var differentLiteral = new ol.style.LineLiteral({ - strokeStyle: '#013', + strokeColor: '#013', strokeWidth: 3, opacity: 1 }); @@ -34,7 +34,7 @@ describe('ol.style.Line', function() { it('accepts literal values', function() { var symbolizer = new ol.style.Line({ - strokeStyle: '#BADA55', + strokeColor: '#BADA55', strokeWidth: 3 }); expect(symbolizer).toBeA(ol.style.Line); diff --git a/test/spec/ol/style/polygon.test.js b/test/spec/ol/style/polygon.test.js index 34a0cdaf62..8859fe4780 100644 --- a/test/spec/ol/style/polygon.test.js +++ b/test/spec/ol/style/polygon.test.js @@ -7,19 +7,19 @@ describe('ol.style.PolygonLiteral', function() { it('identifies equal literals', function() { var literal = new ol.style.PolygonLiteral({ strokeWidth: 3, - strokeStyle: '#013', - fillStyle: '#BADA55', + strokeColor: '#013', + fillColor: '#BADA55', opacity: 1 }); var equalLiteral = new ol.style.PolygonLiteral({ - fillStyle: '#BADA55', - strokeStyle: '#013', + fillColor: '#BADA55', + strokeColor: '#013', strokeWidth: 3, opacity: 1 }); var differentLiteral = new ol.style.PolygonLiteral({ - fillStyle: '#013', - strokeStyle: '#013', + fillColor: '#013', + strokeColor: '#013', strokeWidth: 3, opacity: 1 }); @@ -37,7 +37,7 @@ describe('ol.style.Polygon', function() { it('accepts literal values', function() { var symbolizer = new ol.style.Polygon({ - fillStyle: '#BADA55', + fillColor: '#BADA55', strokeWidth: 3 }); expect(symbolizer).toBeA(ol.style.Polygon); @@ -46,7 +46,7 @@ describe('ol.style.Polygon', function() { it('accepts expressions', function() { var symbolizer = new ol.style.Polygon({ opacity: new ol.Expression('value / 100'), - fillStyle: new ol.Expression('fillAttr') + fillColor: new ol.Expression('fillAttr') }); expect(symbolizer).toBeA(ol.style.Polygon); }); @@ -58,7 +58,7 @@ describe('ol.style.Polygon', function() { it('evaluates expressions with the given feature', function() { var symbolizer = new ol.style.Polygon({ opacity: new ol.Expression('value / 100'), - fillStyle: new ol.Expression('fillAttr') + fillColor: new ol.Expression('fillAttr') }); var feature = new ol.Feature({ @@ -69,20 +69,20 @@ describe('ol.style.Polygon', function() { var literal = symbolizer.createLiteral(feature); expect(literal).toBeA(ol.style.PolygonLiteral); expect(literal.opacity).toBe(42 / 100); - expect(literal.fillStyle).toBe('#ff0000'); - expect(literal.strokeStyle).toBeUndefined(); + expect(literal.fillColor).toBe('#ff0000'); + expect(literal.strokeColor).toBeUndefined(); }); - it('applies default strokeWidth if only strokeStyle is given', function() { + it('applies default strokeWidth if only strokeColor is given', function() { var symbolizer = new ol.style.Polygon({ - strokeStyle: '#ff0000' + strokeColor: '#ff0000' }); var literal = symbolizer.createLiteral(); expect(literal).toBeA(ol.style.PolygonLiteral); - expect(literal.strokeStyle).toBe('#ff0000'); + expect(literal.strokeColor).toBe('#ff0000'); expect(literal.strokeWidth).toBe(1.5); - expect(literal.fillStyle).toBeUndefined(); + expect(literal.fillColor).toBeUndefined(); }); }); diff --git a/test/spec/ol/style/shape.test.js b/test/spec/ol/style/shape.test.js index 147528df0c..dfd8c8c377 100644 --- a/test/spec/ol/style/shape.test.js +++ b/test/spec/ol/style/shape.test.js @@ -8,24 +8,24 @@ describe('ol.style.ShapeLiteral', function() { var literal = new ol.style.ShapeLiteral({ type: ol.style.ShapeType.CIRCLE, size: 4, - fillStyle: '#BADA55', - strokeStyle: '#013', + fillColor: '#BADA55', + strokeColor: '#013', strokeWidth: 3, opacity: 1 }); var equalLiteral = new ol.style.ShapeLiteral({ type: ol.style.ShapeType.CIRCLE, size: 4, - fillStyle: '#BADA55', - strokeStyle: '#013', + fillColor: '#BADA55', + strokeColor: '#013', strokeWidth: 3, opacity: 1 }); var differentLiteral = new ol.style.ShapeLiteral({ type: ol.style.ShapeType.CIRCLE, size: 4, - fillStyle: '#013', - strokeStyle: '#013', + fillColor: '#013', + strokeColor: '#013', strokeWidth: 3, opacity: 1 }); @@ -44,7 +44,7 @@ describe('ol.style.Shape', function() { it('accepts literal values', function() { var symbolizer = new ol.style.Shape({ size: 4, - fillStyle: '#BADA55' + fillColor: '#BADA55' }); expect(symbolizer).toBeA(ol.style.Shape); }); @@ -52,7 +52,7 @@ describe('ol.style.Shape', function() { it('accepts expressions', function() { var symbolizer = new ol.style.Shape({ size: new ol.Expression('sizeAttr'), - strokeStyle: new ol.Expression('color') + strokeColor: new ol.Expression('color') }); expect(symbolizer).toBeA(ol.style.Shape); }); @@ -65,7 +65,7 @@ describe('ol.style.Shape', function() { var symbolizer = new ol.style.Shape({ size: new ol.Expression('sizeAttr'), opacity: new ol.Expression('opacityAttr'), - fillStyle: '#BADA55' + fillColor: '#BADA55' }); var feature = new ol.Feature({ @@ -83,8 +83,8 @@ describe('ol.style.Shape', function() { var symbolizer = new ol.style.Shape({ size: 10, opacity: 1, - fillStyle: '#BADA55', - strokeStyle: '#013', + fillColor: '#BADA55', + strokeColor: '#013', strokeWidth: 2 }); @@ -92,8 +92,8 @@ describe('ol.style.Shape', function() { expect(literal).toBeA(ol.style.ShapeLiteral); expect(literal.size).toBe(10); expect(literal.opacity).toBe(1); - expect(literal.fillStyle).toBe('#BADA55'); - expect(literal.strokeStyle).toBe('#013'); + expect(literal.fillColor).toBe('#BADA55'); + expect(literal.strokeColor).toBe('#013'); expect(literal.strokeWidth).toBe(2); }); @@ -101,7 +101,7 @@ describe('ol.style.Shape', function() { var symbolizer = new ol.style.Shape({ size: new ol.Expression('sizeAttr'), opacity: new ol.Expression('opacityAttr'), - fillStyle: '#BADA55' + fillColor: '#BADA55' }); var feature = new ol.Feature({ diff --git a/test/spec/ol/style/style.test.js b/test/spec/ol/style/style.test.js index 9b76d23b60..599982e39d 100644 --- a/test/spec/ol/style/style.test.js +++ b/test/spec/ol/style/style.test.js @@ -15,7 +15,7 @@ describe('ol.style.Style', function() { symbolizers: [ new ol.style.Shape({ size: 4, - fillStyle: '#BADA55' + fillColor: '#BADA55' }) ] }) @@ -24,7 +24,7 @@ describe('ol.style.Style', function() { var feature = new ol.Feature(); feature.set('foo', 'bar'); expect(style.apply(feature).length).toBe(1); - expect(style.apply(feature)[0].fillStyle).toBe('#BADA55'); + expect(style.apply(feature)[0].fillColor).toBe('#BADA55'); feature.set('foo', 'baz'); expect(style.apply(feature).length).toBe(0); });