Merge pull request #1090 from tschaub/symbolizer-z

Add zIndex property to symbolizers.  Symbolizers with the same zIndex (in addition to other properties) are considered equal.  A subsequent change will sort features by symbolizer zIndex before rendering.
This commit is contained in:
Tim Schaub
2013-10-02 22:32:34 -07:00
22 changed files with 598 additions and 126 deletions

View File

@@ -692,6 +692,7 @@
* point to the center of the icon (positive values shift image left).
* @property {number|ol.expr.Expression|undefined} yOffset Pixel offset from the
* point to the center of the icon (positive values shift image down).
* @property {number|ol.expr.Expression|undefined} zIndex Stack order.
*/
/**
@@ -699,6 +700,7 @@
* @property {string|ol.expr.Expression|undefined} color Fill color as hex color
* code.
* @property {number|ol.expr.Expression|undefined} opacity Opacity (0-1).
* @property {number|ol.expr.Expression|undefined} zIndex Stack order.
*/
/**
@@ -719,6 +721,7 @@
* @property {number|ol.expr.Expression|undefined} size Size in pixels.
* @property {ol.style.Fill|undefined} fill Fill symbolizer for shape.
* @property {ol.style.Stroke|undefined} stroke Stroke symbolizer for shape.
* @property {number|ol.expr.Expression|undefined} zIndex Stack order.
*/
/**
@@ -727,6 +730,7 @@
* color code.
* @property {number|ol.expr.Expression|undefined} opacity Stroke opacity (0-1).
* @property {number|ol.expr.Expression|undefined} width Stroke width in pixels.
* @property {number|ol.expr.Expression|undefined} zIndex Stack order.
*/
/**
@@ -744,6 +748,7 @@
* @property {number|ol.expr.Expression|undefined} fontSize Font size in pixels.
* @property {string|ol.expr.Expression} text Text for the label.
* @property {number|ol.expr.Expression|undefined} opacity Opacity (0-1).
* @property {number|ol.expr.Expression|undefined} zIndex Stack order.
*/
/**

View File

@@ -38,6 +38,15 @@ ol.style.Fill = function(opt_options) {
(options.opacity instanceof ol.expr.Expression) ?
options.opacity : new ol.expr.Literal(options.opacity);
/**
* @type {ol.expr.Expression}
* @private
*/
this.zIndex_ = !goog.isDefAndNotNull(options.zIndex) ?
new ol.expr.Literal(ol.style.FillDefaults.zIndex) :
(options.zIndex instanceof ol.expr.Expression) ?
options.zIndex : new ol.expr.Literal(options.zIndex);
};
goog.inherits(ol.style.Fill, ol.style.Symbolizer);
@@ -67,9 +76,13 @@ ol.style.Fill.prototype.createLiteral = function(featureOrType) {
var opacity = Number(ol.expr.evaluateFeature(this.opacity_, feature));
goog.asserts.assert(!isNaN(opacity), 'opacity must be a number');
var zIndex = Number(ol.expr.evaluateFeature(this.zIndex_, feature));
goog.asserts.assert(!isNaN(zIndex), 'zIndex must be a number');
literal = new ol.style.PolygonLiteral({
fillColor: color,
fillOpacity: opacity
fillOpacity: opacity,
zIndex: zIndex
});
}
@@ -95,6 +108,15 @@ ol.style.Fill.prototype.getOpacity = function() {
};
/**
* Get the fill zIndex.
* @return {ol.expr.Expression} Fill zIndex.
*/
ol.style.Fill.prototype.getZIndex = function() {
return this.zIndex_;
};
/**
* Set the fill color.
* @param {ol.expr.Expression} color Fill color.
@@ -116,10 +138,22 @@ ol.style.Fill.prototype.setOpacity = function(opacity) {
/**
* @typedef {{color: (string),
* opacity: (number)}}
* Set the fill zIndex.
* @param {ol.expr.Expression} zIndex Fill zIndex.
*/
ol.style.Fill.prototype.setZIndex = function(zIndex) {
goog.asserts.assertInstanceof(zIndex, ol.expr.Expression);
this.zIndex_ = zIndex;
};
/**
* @typedef {{fillColor: string,
* fillOpacity: number,
* zIndex: number}}
*/
ol.style.FillDefaults = {
color: '#ffffff',
opacity: 0.4
opacity: 0.4,
zIndex: 0
};

View File

@@ -1,5 +1,6 @@
goog.provide('ol.style.IconLiteral');
goog.require('goog.asserts');
goog.require('ol.style.PointLiteral');
@@ -10,7 +11,8 @@ goog.require('ol.style.PointLiteral');
* opacity: number,
* rotation: number,
* xOffset: number,
* yOffset: number}}
* yOffset: number,
* zIndex: number}}
*/
ol.style.IconLiteralOptions;
@@ -44,6 +46,11 @@ ol.style.IconLiteral = function(options) {
/** @type {number} */
this.yOffset = options.yOffset;
goog.asserts.assertNumber(
options.zIndex, 'zIndex must be a number');
/** @type {number} */
this.zIndex = options.zIndex;
};
goog.inherits(ol.style.IconLiteral, ol.style.PointLiteral);
@@ -51,12 +58,13 @@ goog.inherits(ol.style.IconLiteral, ol.style.PointLiteral);
/**
* @inheritDoc
*/
ol.style.IconLiteral.prototype.equals = function(iconLiteral) {
return this.url == iconLiteral.url &&
this.width == iconLiteral.width &&
this.height == iconLiteral.height &&
this.opacity == iconLiteral.opacity &&
this.rotation == iconLiteral.rotation &&
this.xOffset == iconLiteral.xOffset &&
this.yOffset == iconLiteral.yOffset;
ol.style.IconLiteral.prototype.equals = function(other) {
return this.url == other.url &&
this.width == other.width &&
this.height == other.height &&
this.opacity == other.opacity &&
this.rotation == other.rotation &&
this.xOffset == other.xOffset &&
this.yOffset == other.yOffset &&
this.zIndex == other.zIndex;
};

View File

@@ -81,6 +81,15 @@ ol.style.Icon = function(options) {
(options.yOffset instanceof ol.expr.Expression) ?
options.yOffset : new ol.expr.Literal(options.yOffset);
/**
* @type {ol.expr.Expression}
* @private
*/
this.zIndex_ = !goog.isDefAndNotNull(options.zIndex) ?
new ol.expr.Literal(ol.style.IconDefaults.zIndex) :
(options.zIndex instanceof ol.expr.Expression) ?
options.zIndex : new ol.expr.Literal(options.zIndex);
};
@@ -130,6 +139,9 @@ ol.style.Icon.prototype.createLiteral = function(featureOrType) {
var yOffset = Number(ol.expr.evaluateFeature(this.yOffset_, feature));
goog.asserts.assert(!isNaN(yOffset), 'yOffset must be a number');
var zIndex = Number(ol.expr.evaluateFeature(this.zIndex_, feature));
goog.asserts.assert(!isNaN(zIndex), 'zIndex must be a number');
literal = new ol.style.IconLiteral({
url: url,
width: width,
@@ -137,7 +149,8 @@ ol.style.Icon.prototype.createLiteral = function(featureOrType) {
opacity: opacity,
rotation: rotation,
xOffset: xOffset,
yOffset: yOffset
yOffset: yOffset,
zIndex: zIndex
});
}
@@ -208,6 +221,15 @@ ol.style.Icon.prototype.getYOffset = function() {
};
/**
* Get the zIndex.
* @return {ol.expr.Expression} Icon zIndex.
*/
ol.style.Icon.prototype.getZIndex = function() {
return this.zIndex_;
};
/**
* Set the height.
* @param {ol.expr.Expression} height Icon height.
@@ -278,15 +300,27 @@ ol.style.Icon.prototype.setYOffset = function(yOffset) {
};
/**
* Set the zIndex.
* @param {ol.expr.Expression} zIndex Icon zIndex.
*/
ol.style.Icon.prototype.setZIndex = function(zIndex) {
goog.asserts.assertInstanceof(zIndex, ol.expr.Expression);
this.zIndex_ = zIndex;
};
/**
* @typedef {{opacity: number,
* rotation: number,
* xOffset: number,
* yOffset: number}}
* yOffset: number,
* zIndex: number}}
*/
ol.style.IconDefaults = {
opacity: 1,
rotation: 0,
xOffset: 0,
yOffset: 0
yOffset: 0,
zIndex: 0
};

View File

@@ -5,9 +5,10 @@ goog.require('ol.style.Literal');
/**
* @typedef {{color: (string),
* opacity: (number),
* width: (number)}}
* @typedef {{color: string,
* opacity: number,
* width: number,
* zIndex: number}}
*/
ol.style.LineLiteralOptions;
@@ -36,6 +37,11 @@ ol.style.LineLiteral = function(options) {
/** @type {number} */
this.width = options.width;
goog.asserts.assertNumber(
options.zIndex, 'zIndex must be a number');
/** @type {number} */
this.zIndex = options.zIndex;
};
goog.inherits(ol.style.LineLiteral, ol.style.Literal);
@@ -43,8 +49,9 @@ goog.inherits(ol.style.LineLiteral, ol.style.Literal);
/**
* @inheritDoc
*/
ol.style.LineLiteral.prototype.equals = function(lineLiteral) {
return this.color == lineLiteral.color &&
this.opacity == lineLiteral.opacity &&
this.width == lineLiteral.width;
ol.style.LineLiteral.prototype.equals = function(other) {
return this.color == other.color &&
this.opacity == other.opacity &&
this.width == other.width &&
this.zIndex == other.zIndex;
};

View File

@@ -9,7 +9,8 @@ goog.require('ol.style.Literal');
* fillOpacity: (number|undefined),
* strokeColor: (string|undefined),
* strokeOpacity: (number|undefined),
* strokeWidth: (number|undefined)}}
* strokeWidth: (number|undefined),
* zIndex: number}}
*/
ol.style.PolygonLiteralOptions;
@@ -66,6 +67,11 @@ ol.style.PolygonLiteral = function(options) {
'Either fillColor and fillOpacity or ' +
'strokeColor and strokeOpacity and strokeWidth must be set');
goog.asserts.assertNumber(
options.zIndex, 'zIndex must be a number');
/** @type {number} */
this.zIndex = options.zIndex;
};
goog.inherits(ol.style.PolygonLiteral, ol.style.Literal);
@@ -73,10 +79,11 @@ goog.inherits(ol.style.PolygonLiteral, ol.style.Literal);
/**
* @inheritDoc
*/
ol.style.PolygonLiteral.prototype.equals = function(polygonLiteral) {
return this.fillColor == polygonLiteral.fillColor &&
this.fillOpacity == polygonLiteral.fillOpacity &&
this.strokeColor == polygonLiteral.strokeColor &&
this.strokeOpacity == polygonLiteral.strokeOpacity &&
this.strokeWidth == polygonLiteral.strokeWidth;
ol.style.PolygonLiteral.prototype.equals = function(other) {
return this.fillColor == other.fillColor &&
this.fillOpacity == other.fillOpacity &&
this.strokeColor == other.strokeColor &&
this.strokeOpacity == other.strokeOpacity &&
this.strokeWidth == other.strokeWidth &&
this.zIndex == other.zIndex;
};

View File

@@ -20,7 +20,8 @@ ol.style.ShapeType = {
* fillOpacity: (number|undefined),
* strokeColor: (string|undefined),
* strokeOpacity: (number|undefined),
* strokeWidth: (number|undefined)}}
* strokeWidth: (number|undefined),
* zIndex: number}}
*/
ol.style.ShapeLiteralOptions;
@@ -84,6 +85,11 @@ ol.style.ShapeLiteral = function(options) {
'Either fillColor and fillOpacity or ' +
'strokeColor and strokeOpacity and strokeWidth must be set');
goog.asserts.assertNumber(
options.zIndex, 'zIndex must be a number');
/** @type {number} */
this.zIndex = options.zIndex;
};
goog.inherits(ol.style.ShapeLiteral, ol.style.PointLiteral);
@@ -91,12 +97,13 @@ goog.inherits(ol.style.ShapeLiteral, ol.style.PointLiteral);
/**
* @inheritDoc
*/
ol.style.ShapeLiteral.prototype.equals = function(shapeLiteral) {
return this.type == shapeLiteral.type &&
this.size == shapeLiteral.size &&
this.fillColor == shapeLiteral.fillColor &&
this.fillOpacity == shapeLiteral.fillOpacity &&
this.strokeColor == shapeLiteral.strokeColor &&
this.strokeOpacity == shapeLiteral.strokeOpacity &&
this.strokeWidth == shapeLiteral.strokeWidth;
ol.style.ShapeLiteral.prototype.equals = function(other) {
return this.type == other.type &&
this.size == other.size &&
this.fillColor == other.fillColor &&
this.fillOpacity == other.fillOpacity &&
this.strokeColor == other.strokeColor &&
this.strokeOpacity == other.strokeOpacity &&
this.strokeWidth == other.strokeWidth &&
this.zIndex == other.zIndex;
};

View File

@@ -53,6 +53,15 @@ ol.style.Shape = function(options) {
goog.asserts.assert(this.fill_ || this.stroke_,
'Stroke or fill must be provided');
/**
* @type {ol.expr.Expression}
* @private
*/
this.zIndex_ = !goog.isDefAndNotNull(options.zIndex) ?
new ol.expr.Literal(ol.style.ShapeDefaults.zIndex) :
(options.zIndex instanceof ol.expr.Expression) ?
options.zIndex : new ol.expr.Literal(options.zIndex);
};
@@ -100,6 +109,9 @@ ol.style.Shape.prototype.createLiteral = function(featureOrType) {
goog.asserts.assert(!isNaN(strokeWidth), 'strokeWidth must be a number');
}
var zIndex = Number(ol.expr.evaluateFeature(this.zIndex_, feature));
goog.asserts.assert(!isNaN(zIndex), 'zIndex must be a number');
literal = new ol.style.ShapeLiteral({
type: this.type_,
size: size,
@@ -107,7 +119,8 @@ ol.style.Shape.prototype.createLiteral = function(featureOrType) {
fillOpacity: fillOpacity,
strokeColor: strokeColor,
strokeOpacity: strokeOpacity,
strokeWidth: strokeWidth
strokeWidth: strokeWidth,
zIndex: zIndex
});
}
@@ -151,6 +164,15 @@ ol.style.Shape.prototype.getType = function() {
};
/**
* Get the shape zIndex.
* @return {ol.expr.Expression} Shape zIndex.
*/
ol.style.Shape.prototype.getZIndex = function() {
return this.zIndex_;
};
/**
* Set the fill.
* @param {ol.style.Fill} fill Shape fill.
@@ -195,10 +217,22 @@ ol.style.Shape.prototype.setType = function(type) {
/**
* @typedef {{type: (ol.style.ShapeType),
* size: (number)}}
* Set the shape zIndex.
* @param {ol.expr.Expression} zIndex Shape zIndex.
*/
ol.style.Shape.prototype.setZIndex = function(zIndex) {
goog.asserts.assertInstanceof(zIndex, ol.expr.Expression);
this.zIndex_ = zIndex;
};
/**
* @typedef {{type: ol.style.ShapeType,
* size: number,
* zIndex: number}}
*/
ol.style.ShapeDefaults = {
type: ol.style.ShapeType.CIRCLE,
size: 5
size: 5,
zIndex: 0
};

View File

@@ -49,6 +49,15 @@ ol.style.Stroke = function(opt_options) {
(options.width instanceof ol.expr.Expression) ?
options.width : new ol.expr.Literal(options.width);
/**
* @type {ol.expr.Expression}
* @private
*/
this.zIndex_ = !goog.isDefAndNotNull(options.zIndex) ?
new ol.expr.Literal(ol.style.StrokeDefaults.zIndex) :
(options.zIndex instanceof ol.expr.Expression) ?
options.zIndex : new ol.expr.Literal(options.zIndex);
};
goog.inherits(ol.style.Stroke, ol.style.Symbolizer);
@@ -79,20 +88,25 @@ ol.style.Stroke.prototype.createLiteral = function(featureOrType) {
this.width_, feature));
goog.asserts.assert(!isNaN(width), 'width must be a number');
var zIndex = Number(ol.expr.evaluateFeature(this.zIndex_, feature));
goog.asserts.assert(!isNaN(zIndex), 'zIndex must be a number');
var literal = null;
if (type === ol.geom.GeometryType.LINESTRING ||
type === ol.geom.GeometryType.MULTILINESTRING) {
literal = new ol.style.LineLiteral({
color: color,
opacity: opacity,
width: width
width: width,
zIndex: zIndex
});
} else if (type === ol.geom.GeometryType.POLYGON ||
type === ol.geom.GeometryType.MULTIPOLYGON) {
literal = new ol.style.PolygonLiteral({
strokeColor: color,
strokeOpacity: opacity,
strokeWidth: width
strokeWidth: width,
zIndex: zIndex
});
}
@@ -127,6 +141,15 @@ ol.style.Stroke.prototype.getWidth = function() {
};
/**
* Get the stroke zIndex.
* @return {ol.expr.Expression} Stroke zIndex.
*/
ol.style.Stroke.prototype.getZIndex = function() {
return this.zIndex_;
};
/**
* Set the stroke color.
* @param {ol.expr.Expression} color Stroke color.
@@ -158,24 +181,24 @@ ol.style.Stroke.prototype.setWidth = function(width) {
/**
* @typedef {{color: (string),
* opacity: (number),
* width: (number)}}
* Set the stroke zIndex.
* @param {ol.expr.Expression} zIndex Stroke zIndex.
*/
ol.style.StrokeDefaults = {
color: '#696969',
opacity: 0.75,
width: 1.5
ol.style.Stroke.prototype.setZIndex = function(zIndex) {
goog.asserts.assertInstanceof(zIndex, ol.expr.Expression);
this.zIndex_ = zIndex;
};
/**
* @typedef {{color: (string),
* opacity: (number),
* width: (number)}}
* @typedef {{strokeColor: string,
* strokeOpacity: number,
* strokeWidth: number,
* zIndex: number}}
*/
ol.style.StrokeDefaultsSelect = {
ol.style.StrokeDefaults = {
color: '#696969',
opacity: 0.9,
width: 2.0
opacity: 0.75,
width: 1.5,
zIndex: 0
};

View File

@@ -9,7 +9,8 @@ goog.require('ol.style.Literal');
* fontFamily: string,
* fontSize: number,
* text: string,
* opacity: number}}
* opacity: number,
* zIndex: number}}
*/
ol.style.TextLiteralOptions;
@@ -42,6 +43,10 @@ ol.style.TextLiteral = function(options) {
/** @type {number} */
this.opacity = options.opacity;
goog.asserts.assertNumber(options.zIndex, 'zIndex must be a number');
/** @type {number} */
this.zIndex = options.zIndex;
};
goog.inherits(ol.style.TextLiteral, ol.style.Literal);
@@ -49,9 +54,10 @@ goog.inherits(ol.style.TextLiteral, ol.style.Literal);
/**
* @inheritDoc
*/
ol.style.TextLiteral.prototype.equals = function(textLiteral) {
return this.color == textLiteral.color &&
this.fontFamily == textLiteral.fontFamily &&
this.fontSize == textLiteral.fontSize &&
this.opacity == textLiteral.opacity;
ol.style.TextLiteral.prototype.equals = function(other) {
return this.color == other.color &&
this.fontFamily == other.fontFamily &&
this.fontSize == other.fontSize &&
this.opacity == other.opacity &&
this.zIndex == other.zIndex;
};

View File

@@ -60,6 +60,15 @@ ol.style.Text = function(options) {
(options.opacity instanceof ol.expr.Expression) ?
options.opacity : new ol.expr.Literal(options.opacity);
/**
* @type {ol.expr.Expression}
* @private
*/
this.zIndex_ = !goog.isDefAndNotNull(options.zIndex) ?
new ol.expr.Literal(ol.style.TextDefaults.zIndex) :
(options.zIndex instanceof ol.expr.Expression) ?
options.zIndex : new ol.expr.Literal(options.zIndex);
};
goog.inherits(ol.style.Text, ol.style.Symbolizer);
@@ -93,12 +102,16 @@ ol.style.Text.prototype.createLiteral = function(featureOrType) {
var opacity = Number(ol.expr.evaluateFeature(this.opacity_, feature));
goog.asserts.assert(!isNaN(opacity), 'opacity must be a number');
var zIndex = Number(ol.expr.evaluateFeature(this.zIndex_, feature));
goog.asserts.assert(!isNaN(zIndex), 'zIndex must be a number');
return new ol.style.TextLiteral({
color: color,
fontFamily: fontFamily,
fontSize: fontSize,
text: text,
opacity: opacity
opacity: opacity,
zIndex: zIndex
});
};
@@ -148,6 +161,15 @@ ol.style.Text.prototype.getText = function() {
};
/**
* Get the zIndex.
* @return {ol.expr.Expression} Text.
*/
ol.style.Text.prototype.getZIndex = function() {
return this.zIndex_;
};
/**
* Set the font color.
* @param {ol.expr.Expression} color Font color.
@@ -198,15 +220,27 @@ ol.style.Text.prototype.setText = function(text) {
};
/**
* Set the zIndex.
* @param {ol.expr.Expression} zIndex Text.
*/
ol.style.Text.prototype.setZIndex = function(zIndex) {
goog.asserts.assertInstanceof(zIndex, ol.expr.Expression);
this.zIndex_ = zIndex;
};
/**
* @typedef {{color: string,
* fontFamily: string,
* fontSize: number,
* opacity: number}}
* opacity: number,
* zIndex: number}}
*/
ol.style.TextDefaults = {
color: '#000',
fontFamily: 'sans-serif',
fontSize: 10,
opacity: 1
opacity: 1,
zIndex: 0
};

View File

@@ -19,6 +19,15 @@ describe('ol.style.Fill', function() {
expect(symbolizer).to.be.a(ol.style.Fill);
});
it('accepts zIndex', function() {
var symbolizer = new ol.style.Fill({
opacity: ol.expr.parse('value / 100'),
color: ol.expr.parse('fillAttr'),
zIndex: 3
});
expect(symbolizer).to.be.a(ol.style.Fill);
});
});
describe('#createLiteral()', function() {
@@ -40,6 +49,7 @@ describe('ol.style.Fill', function() {
expect(literal).to.be.a(ol.style.PolygonLiteral);
expect(literal.fillOpacity).to.be(42 / 100);
expect(literal.fillColor).to.be('#ff0000');
expect(literal.zIndex).to.be(0);
});
it('applies default opacity', function() {
@@ -81,6 +91,46 @@ describe('ol.style.Fill', function() {
expect(literal.fillOpacity).to.be(0.55);
});
it('handles zIndex', function() {
var symbolizer = new ol.style.Fill({
opacity: 0.8,
zIndex: 2
});
var literal = symbolizer.createLiteral(ol.geom.GeometryType.POLYGON);
expect(literal).to.be.a(ol.style.PolygonLiteral);
expect(literal.fillColor).to.be('#ffffff');
expect(literal.fillOpacity).to.be(0.8);
expect(literal.zIndex).to.be(2);
});
it('applies default zIndex', function() {
var symbolizer = new ol.style.Fill({
opacity: 0.8
});
var literal = symbolizer.createLiteral(ol.geom.GeometryType.POLYGON);
expect(literal).to.be.a(ol.style.PolygonLiteral);
expect(literal.zIndex).to.be(0);
});
it('casts zIndex to number', function() {
var symbolizer = new ol.style.Fill({
zIndex: ol.expr.parse('zIndex'),
color: '#ff00ff'
});
var feature = new ol.Feature({
zIndex: '11',
geometry: new ol.geom.Polygon(
[[[0, 0], [1, 0], [1, 1], [0, 1], [0, 0]]])
});
var literal = symbolizer.createLiteral(feature);
expect(literal).to.be.a(ol.style.PolygonLiteral);
expect(literal.zIndex).to.be(11);
});
});
describe('#getColor()', function() {
@@ -112,6 +162,21 @@ describe('ol.style.Fill', function() {
});
describe('#getZIndex()', function() {
it('returns the zIndex', function() {
var symbolizer = new ol.style.Fill({
color: '#ffffff',
zIndex: 11
});
var zIndex = symbolizer.getZIndex();
expect(zIndex).to.be.a(ol.expr.Literal);
expect(zIndex.getValue()).to.be(11);
});
});
describe('#setColor()', function() {
it('sets the fill color', function() {

View File

@@ -10,56 +10,72 @@ describe('ol.style.IconLiteral', function() {
width: 20,
opacity: 1,
rotation: 0.1,
url: 'http://example.com/1.png'
url: 'http://example.com/1.png',
zIndex: 0
});
var equalLiteral = new ol.style.IconLiteral({
height: 10,
width: 20,
opacity: 1,
rotation: 0.1,
url: 'http://example.com/1.png'
url: 'http://example.com/1.png',
zIndex: 0
});
var differentLiteral1 = new ol.style.IconLiteral({
var differentHeight = new ol.style.IconLiteral({
height: 11,
width: 20,
opacity: 1,
rotation: 0.1,
url: 'http://example.com/1.png'
url: 'http://example.com/1.png',
zIndex: 0
});
var differentLiteral2 = new ol.style.IconLiteral({
var differentWidth = new ol.style.IconLiteral({
height: 10,
width: 2,
opacity: 1,
rotation: 0.1,
url: 'http://example.com/1.png'
url: 'http://example.com/1.png',
zIndex: 0
});
var differentLiteral3 = new ol.style.IconLiteral({
var differentOpacity = new ol.style.IconLiteral({
height: 10,
width: 20,
opacity: 0.5,
rotation: 0.1,
url: 'http://example.com/1.png'
url: 'http://example.com/1.png',
zIndex: 0
});
var differentLiteral4 = new ol.style.IconLiteral({
var differentRotation = new ol.style.IconLiteral({
height: 10,
width: 20,
opacity: 1,
rotation: 0.2,
url: 'http://example.com/1.png'
url: 'http://example.com/1.png',
zIndex: 0
});
var differentLiteral5 = new ol.style.IconLiteral({
var differentUrl = new ol.style.IconLiteral({
height: 10,
width: 20,
opacity: 1,
rotation: 0.1,
url: 'http://example.com/2.png'
url: 'http://example.com/2.png',
zIndex: 0
});
var differentZIndex = new ol.style.IconLiteral({
height: 10,
width: 20,
opacity: 1,
rotation: 0.1,
url: 'http://example.com/1.png',
zIndex: 20
});
expect(literal.equals(equalLiteral)).to.be(true);
expect(literal.equals(differentLiteral1)).to.be(false);
expect(literal.equals(differentLiteral2)).to.be(false);
expect(literal.equals(differentLiteral3)).to.be(false);
expect(literal.equals(differentLiteral4)).to.be(false);
expect(literal.equals(differentLiteral5)).to.be(false);
expect(literal.equals(differentHeight)).to.be(false);
expect(literal.equals(differentWidth)).to.be(false);
expect(literal.equals(differentOpacity)).to.be(false);
expect(literal.equals(differentRotation)).to.be(false);
expect(literal.equals(differentUrl)).to.be(false);
expect(literal.equals(differentZIndex)).to.be(false);
});
});

View File

@@ -30,6 +30,18 @@ describe('ol.style.Icon', function() {
expect(symbolizer).to.be.a(ol.style.Icon);
});
it('accepts zIndex', function() {
var symbolizer = new ol.style.Icon({
height: ol.expr.parse('10'),
width: ol.expr.parse('20'),
opacity: ol.expr.parse('1'),
rotation: ol.expr.parse('0.1'),
url: ol.expr.parse('"http://example.com/1.png"'),
zIndex: 3
});
expect(symbolizer).to.be.a(ol.style.Icon);
});
});
describe('#createLiteral()', function() {
@@ -65,6 +77,7 @@ describe('ol.style.Icon', function() {
expect(literal.xOffset).to.be(20);
expect(literal.yOffset).to.be(30);
expect(literal.url).to.be('http://example.com/1.png');
expect(literal.zIndex).to.be(0);
});
it('can be called without a feature', function() {
@@ -223,6 +236,49 @@ describe('ol.style.Icon', function() {
expect(literal.yOffset).to.be(42);
});
it('handles zIndex', function() {
var symbolizer = new ol.style.Icon({
height: ol.expr.parse('10'),
width: ol.expr.parse('20'),
url: ol.expr.parse('"http://example.com/1.png"'),
zIndex: 4
});
var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
expect(literal).to.be.a(ol.style.IconLiteral);
expect(literal.xOffset).to.be(0);
expect(literal.zIndex).to.be(4);
});
it('applies default zIndex if none', function() {
var symbolizer = new ol.style.Icon({
height: 10,
width: 20,
url: 'http://example.com/1.png'
});
var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
expect(literal).to.be.a(ol.style.IconLiteral);
expect(literal.zIndex).to.be(0);
});
it('casts zIndex to number', function() {
var symbolizer = new ol.style.Icon({
zIndex: ol.expr.parse('zIndex'),
width: 10,
url: 'http://example.com/1.png'
});
var feature = new ol.Feature({
zIndex: '42',
geometry: new ol.geom.Point([1, 2])
});
var literal = symbolizer.createLiteral(feature);
expect(literal).to.be.a(ol.style.IconLiteral);
expect(literal.zIndex).to.be(42);
});
});
describe('#getHeight()', function() {

View File

@@ -8,32 +8,44 @@ describe('ol.style.LineLiteral', function() {
var literal = new ol.style.LineLiteral({
width: 3,
color: '#BADA55',
opacity: 1
opacity: 1,
zIndex: 0
});
var equalLiteral = new ol.style.LineLiteral({
color: '#BADA55',
width: 3,
opacity: 1
opacity: 1,
zIndex: 0
});
var differentColor = new ol.style.LineLiteral({
width: 3,
color: '#ff0000',
opacity: 1
opacity: 1,
zIndex: 0
});
var differentWidth = new ol.style.LineLiteral({
width: 3.5,
color: '#BADA55',
opacity: 1
opacity: 1,
zIndex: 0
});
var differentOpacity = new ol.style.LineLiteral({
width: 3,
color: '#BADA55',
opacity: 0.5
opacity: 0.5,
zIndex: 0
});
var differentZIndex = new ol.style.LineLiteral({
width: 3,
color: '#BADA55',
opacity: 1,
zIndex: 3
});
expect(literal.equals(equalLiteral)).to.be(true);
expect(literal.equals(differentColor)).to.be(false);
expect(literal.equals(differentWidth)).to.be(false);
expect(literal.equals(differentOpacity)).to.be(false);
expect(literal.equals(differentZIndex)).to.be(false);
});
});

View File

@@ -10,49 +10,64 @@ describe('ol.style.PolygonLiteral', function() {
strokeColor: '#013',
strokeOpacity: 0.4,
fillColor: '#BADA55',
fillOpacity: 0.3
fillOpacity: 0.3,
zIndex: 0
});
var equalLiteral = new ol.style.PolygonLiteral({
strokeWidth: 3,
strokeColor: '#013',
strokeOpacity: 0.4,
fillColor: '#BADA55',
fillOpacity: 0.3
fillOpacity: 0.3,
zIndex: 0
});
var differentStrokeWidth = new ol.style.PolygonLiteral({
strokeWidth: 5,
strokeColor: '#013',
strokeOpacity: 0.4,
fillColor: '#BADA55',
fillOpacity: 0.3
fillOpacity: 0.3,
zIndex: 0
});
var differentStrokeColor = new ol.style.PolygonLiteral({
strokeWidth: 3,
strokeColor: '#ffff00',
strokeOpacity: 0.4,
fillColor: '#BADA55',
fillOpacity: 0.3
fillOpacity: 0.3,
zIndex: 0
});
var differentStrokeOpacity = new ol.style.PolygonLiteral({
strokeWidth: 3,
strokeColor: '#013',
strokeOpacity: 0.41,
fillColor: '#BADA55',
fillOpacity: 0.3
fillOpacity: 0.3,
zIndex: 0
});
var differentFillColor = new ol.style.PolygonLiteral({
strokeWidth: 3,
strokeColor: '#013',
strokeOpacity: 0.4,
fillColor: '#00ffff',
fillOpacity: 0.3
fillOpacity: 0.3,
zIndex: 0
});
var differentFillOpacity = new ol.style.PolygonLiteral({
strokeWidth: 3,
strokeColor: '#013',
strokeOpacity: 0.4,
fillColor: '#BADA55',
fillOpacity: 0.31
fillOpacity: 0.31,
zIndex: 0
});
var differentZIndex = new ol.style.PolygonLiteral({
strokeWidth: 3,
strokeColor: '#013',
strokeOpacity: 0.4,
fillColor: '#BADA55',
fillOpacity: 0.3,
zIndex: 2
});
expect(literal.equals(equalLiteral)).to.be(true);
expect(literal.equals(differentStrokeWidth)).to.be(false);
@@ -60,6 +75,7 @@ describe('ol.style.PolygonLiteral', function() {
expect(literal.equals(differentStrokeOpacity)).to.be(false);
expect(literal.equals(differentFillColor)).to.be(false);
expect(literal.equals(differentFillOpacity)).to.be(false);
expect(literal.equals(differentZIndex)).to.be(false);
});
});

View File

@@ -12,7 +12,8 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.9,
strokeColor: '#013',
strokeOpacity: 0.8,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
});
var equalLiteral = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
@@ -21,7 +22,8 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.9,
strokeColor: '#013',
strokeOpacity: 0.8,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
});
var differentSize = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
@@ -30,7 +32,8 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.9,
strokeColor: '#013',
strokeOpacity: 0.8,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
});
var differentFillColor = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
@@ -39,7 +42,8 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.9,
strokeColor: '#013',
strokeOpacity: 0.8,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
});
var differentFillOpacity = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
@@ -48,7 +52,8 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.8,
strokeColor: '#013',
strokeOpacity: 0.8,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
});
var differentStrokeColor = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
@@ -57,7 +62,8 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.9,
strokeColor: '#ffffff',
strokeOpacity: 0.8,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
});
var differentStrokeOpacity = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
@@ -66,7 +72,8 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.9,
strokeColor: '#013',
strokeOpacity: 0.7,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
});
var differentStrokeWidth = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
@@ -75,7 +82,18 @@ describe('ol.style.ShapeLiteral', function() {
fillOpacity: 0.9,
strokeColor: '#013',
strokeOpacity: 0.8,
strokeWidth: 4
strokeWidth: 4,
zIndex: 0
});
var differentZIndex = new ol.style.ShapeLiteral({
type: ol.style.ShapeType.CIRCLE,
size: 4,
fillColor: '#BADA55',
fillOpacity: 0.9,
strokeColor: '#013',
strokeOpacity: 0.8,
strokeWidth: 3,
zIndex: -1
});
expect(literal.equals(equalLiteral)).to.be(true);
expect(literal.equals(differentSize)).to.be(false);
@@ -84,6 +102,7 @@ describe('ol.style.ShapeLiteral', function() {
expect(literal.equals(differentStrokeColor)).to.be(false);
expect(literal.equals(differentStrokeOpacity)).to.be(false);
expect(literal.equals(differentStrokeWidth)).to.be(false);
expect(literal.equals(differentZIndex)).to.be(false);
});
});

View File

@@ -24,6 +24,17 @@ describe('ol.style.Shape', function() {
expect(symbolizer).to.be.a(ol.style.Shape);
});
it('accepts zIndex', function() {
var symbolizer = new ol.style.Shape({
size: 4,
fill: new ol.style.Fill({
color: '#ff0000'
}),
zIndex: -1
});
expect(symbolizer).to.be.a(ol.style.Shape);
});
});
describe('#createLiteral()', function() {
@@ -47,6 +58,7 @@ describe('ol.style.Shape', function() {
expect(literal).to.be.a(ol.style.ShapeLiteral);
expect(literal.size).to.be(42);
expect(literal.fillOpacity).to.be(0.4);
expect(literal.zIndex).to.be(0);
});
it('can be called without a feature', function() {
@@ -160,6 +172,37 @@ describe('ol.style.Shape', function() {
expect(literal.fillOpacity).to.be(0.42);
});
it('handles zIndex', function() {
var symbolizer = new ol.style.Shape({
stroke: new ol.style.Stroke({
color: '#ff0000'
}),
zIndex: -2
});
var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
expect(literal).to.be.a(ol.style.ShapeLiteral);
expect(literal.zIndex).to.be(-2);
});
it('casts zIndex to number', function() {
var symbolizer = new ol.style.Shape({
fill: new ol.style.Fill({
color: '#BADA55'
}),
zIndex: ol.expr.parse('zIndex')
});
var feature = new ol.Feature({
zIndex: '42',
geometry: new ol.geom.Point([1, 2])
});
var literal = symbolizer.createLiteral(feature);
expect(literal).to.be.a(ol.style.ShapeLiteral);
expect(literal.zIndex).to.be(42);
});
});
describe('#getFill()', function() {

View File

@@ -20,6 +20,15 @@ describe('ol.style.Stroke', function() {
expect(symbolizer).to.be.a(ol.style.Stroke);
});
it('accepts zIndex', function() {
var symbolizer = new ol.style.Stroke({
opacity: ol.expr.parse('value / 100'),
width: ol.expr.parse('widthAttr'),
zIndex: 5
});
expect(symbolizer).to.be.a(ol.style.Stroke);
});
});
describe('#createLiteral()', function() {
@@ -40,6 +49,7 @@ describe('ol.style.Stroke', function() {
expect(literal).to.be.a(ol.style.LineLiteral);
expect(literal.opacity).to.be(42 / 100);
expect(literal.width).to.be(1.5);
expect(literal.zIndex).to.be(0);
});
it('applies the default values', function() {
@@ -50,6 +60,7 @@ describe('ol.style.Stroke', function() {
expect(literal.color).to.be('#696969');
expect(literal.opacity).to.be(0.75);
expect(literal.width).to.be(1.5);
expect(literal.zIndex).to.be(0);
});
});

View File

@@ -194,12 +194,14 @@ describe('ol.style.Style', function() {
var literals = [
new ol.style.PolygonLiteral({
fillColor: '#ff0000',
fillOpacity: 0.5
fillOpacity: 0.5,
zIndex: 0
}),
new ol.style.PolygonLiteral({
strokeColor: '#00ff00',
strokeOpacity: 0.6,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
})
];
@@ -221,12 +223,14 @@ describe('ol.style.Style', function() {
fillOpacity: 0.5,
strokeColor: '#00ff00',
strokeOpacity: 0.6,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
}),
new ol.style.PolygonLiteral({
strokeColor: '#0000ff',
strokeOpacity: 0.7,
strokeWidth: 1
strokeWidth: 1,
zIndex: 0
})
];
@@ -253,18 +257,21 @@ describe('ol.style.Style', function() {
new ol.style.PolygonLiteral({
strokeColor: '#00ff00',
strokeOpacity: 0.6,
strokeWidth: 3
strokeWidth: 3,
zIndex: 0
}),
new ol.style.PolygonLiteral({
fillColor: '#ff0000',
fillOpacity: 0.5
fillOpacity: 0.5,
zIndex: 0
}),
new ol.style.TextLiteral({
color: '#ffffff',
fontFamily: 'Arial',
fontSize: 11,
text: 'Test',
opacity: 0.5
opacity: 0.5,
zIndex: 0
})
];

View File

@@ -10,56 +10,72 @@ describe('ol.style.TextLiteral', function() {
fontFamily: 'Arial',
fontSize: 11,
text: 'Test',
opacity: 0.5
opacity: 0.5,
zIndex: 0
});
var equalLiteral = new ol.style.TextLiteral({
color: '#ff0000',
fontFamily: 'Arial',
fontSize: 11,
text: 'Test',
opacity: 0.5
opacity: 0.5,
zIndex: 0
});
var differentLiteral1 = new ol.style.TextLiteral({
var differentColor = new ol.style.TextLiteral({
color: '#0000ff',
fontFamily: 'Arial',
fontSize: 11,
text: 'Test',
opacity: 0.5
opacity: 0.5,
zIndex: 0
});
var differentLiteral2 = new ol.style.TextLiteral({
var differentFontFamily = new ol.style.TextLiteral({
color: '#ff0000',
fontFamily: 'Dingbats',
fontSize: 11,
text: 'Test',
opacity: 0.5
opacity: 0.5,
zIndex: 0
});
var differentLiteral3 = new ol.style.TextLiteral({
var differentFontSize = new ol.style.TextLiteral({
color: '#ff0000',
fontFamily: 'Arial',
fontSize: 12,
text: 'Test',
opacity: 0.5
opacity: 0.5,
zIndex: 0
});
var differentLiteral4 = new ol.style.TextLiteral({
var differentOpacity = new ol.style.TextLiteral({
color: '#ff0000',
fontFamily: 'Arial',
fontSize: 11,
text: 'Test',
opacity: 0.6
opacity: 0.6,
zIndex: 0
});
var equalLiteral2 = new ol.style.TextLiteral({
color: '#ff0000',
fontFamily: 'Arial',
fontSize: 11,
text: 'Text is not compared for equality',
opacity: 0.5
opacity: 0.5,
zIndex: 0
});
var differentZIndex = new ol.style.TextLiteral({
color: '#ff0000',
fontFamily: 'Arial',
fontSize: 11,
text: 'Test',
opacity: 0.5,
zIndex: 3
});
expect(literal.equals(equalLiteral)).to.be(true);
expect(literal.equals(differentLiteral1)).to.be(false);
expect(literal.equals(differentLiteral2)).to.be(false);
expect(literal.equals(differentLiteral3)).to.be(false);
expect(literal.equals(differentLiteral4)).to.be(false);
expect(literal.equals(differentColor)).to.be(false);
expect(literal.equals(differentFontFamily)).to.be(false);
expect(literal.equals(differentFontSize)).to.be(false);
expect(literal.equals(differentOpacity)).to.be(false);
expect(literal.equals(equalLiteral2)).to.be(true);
expect(literal.equals(differentZIndex)).to.be(false);
});
});

View File

@@ -26,6 +26,18 @@ describe('ol.style.Text', function() {
expect(symbolizer).to.be.a(ol.style.Text);
});
it('accepts zIndex', function() {
var symbolizer = new ol.style.Text({
color: '#ff0000',
fontFamily: 'Arial',
fontSize: 11,
text: 'Test',
opacity: 0.6,
zIndex: 3
});
expect(symbolizer).to.be.a(ol.style.Text);
});
});
describe('#createLiteral()', function() {