Add setStyle and getStyle methods to ol.layer.Vector
The setStyle method accepts a single style, an array of styles, or a style function. The getStyle method returns what was set. Internally, we use the getStyleFunction method which always returns a function. When calling setStyle, a change event is dispatched (fixes #1671).
This commit is contained in:
+34
-17
@@ -9,8 +9,7 @@ goog.require('ol.layer.Layer');
|
|||||||
* @enum {string}
|
* @enum {string}
|
||||||
*/
|
*/
|
||||||
ol.layer.VectorProperty = {
|
ol.layer.VectorProperty = {
|
||||||
RENDER_GEOMETRY_FUNCTIONS: 'renderGeometryFunctions',
|
RENDER_GEOMETRY_FUNCTIONS: 'renderGeometryFunctions'
|
||||||
STYLE_FUNCTION: 'styleFunction'
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
@@ -32,8 +31,22 @@ ol.layer.Vector = function(opt_options) {
|
|||||||
delete baseOptions.style;
|
delete baseOptions.style;
|
||||||
goog.base(this, baseOptions);
|
goog.base(this, baseOptions);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* User provided style.
|
||||||
|
* @type {ol.style.Style|Array.<ol.style.Style>|ol.feature.StyleFunction}
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
this.style_ = null;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Style function for use within the library.
|
||||||
|
* @type {ol.feature.StyleFunction}
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
this.styleFunction_;
|
||||||
|
|
||||||
if (goog.isDef(options.style)) {
|
if (goog.isDef(options.style)) {
|
||||||
this.setStyleFunction(ol.feature.createStyleFunction(options.style));
|
this.setStyle(options.style);
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
@@ -55,17 +68,22 @@ goog.exportProperty(
|
|||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @return {ol.feature.StyleFunction|undefined} Style function.
|
* @return {ol.style.Style|Array.<ol.style.Style>|ol.feature.StyleFunction}
|
||||||
|
* Layer style.
|
||||||
|
* @todo stability experimental
|
||||||
|
*/
|
||||||
|
ol.layer.Vector.prototype.getStyle = function() {
|
||||||
|
return this.style_;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @return {ol.feature.StyleFunction} Layer style function.
|
||||||
* @todo stability experimental
|
* @todo stability experimental
|
||||||
*/
|
*/
|
||||||
ol.layer.Vector.prototype.getStyleFunction = function() {
|
ol.layer.Vector.prototype.getStyleFunction = function() {
|
||||||
return /** @type {ol.feature.StyleFunction|undefined} */ (
|
return this.styleFunction_;
|
||||||
this.get(ol.layer.VectorProperty.STYLE_FUNCTION));
|
|
||||||
};
|
};
|
||||||
goog.exportProperty(
|
|
||||||
ol.layer.Vector.prototype,
|
|
||||||
'getStyleFunction',
|
|
||||||
ol.layer.Vector.prototype.getStyleFunction);
|
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -88,13 +106,12 @@ goog.exportProperty(
|
|||||||
* If the styles are changed by setting a new style function or by changing the
|
* If the styles are changed by setting a new style function or by changing the
|
||||||
* value returned by the style function then `dispatchChangeEvent` should be
|
* value returned by the style function then `dispatchChangeEvent` should be
|
||||||
* called on the layer for the layer to be refreshed on the screen.
|
* called on the layer for the layer to be refreshed on the screen.
|
||||||
* @param {ol.feature.StyleFunction|undefined} styleFunction Style function.
|
* @param {ol.style.Style|Array.<ol.style.Style>|ol.feature.StyleFunction} style
|
||||||
|
* Layer style.
|
||||||
* @todo stability experimental
|
* @todo stability experimental
|
||||||
*/
|
*/
|
||||||
ol.layer.Vector.prototype.setStyleFunction = function(styleFunction) {
|
ol.layer.Vector.prototype.setStyle = function(style) {
|
||||||
this.set(ol.layer.VectorProperty.STYLE_FUNCTION, styleFunction);
|
this.style_ = style;
|
||||||
|
this.styleFunction_ = ol.feature.createStyleFunction(style);
|
||||||
|
this.dispatchChangeEvent();
|
||||||
};
|
};
|
||||||
goog.exportProperty(
|
|
||||||
ol.layer.Vector.prototype,
|
|
||||||
'setStyleFunction',
|
|
||||||
ol.layer.Vector.prototype.setStyleFunction);
|
|
||||||
|
|||||||
@@ -46,6 +46,69 @@ describe('ol.layer.Vector', function() {
|
|||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('#setStyle()', function() {
|
||||||
|
|
||||||
|
var source = new ol.source.Vector();
|
||||||
|
var style = new ol.style.Style();
|
||||||
|
|
||||||
|
it('allows the style to be set after construction', function() {
|
||||||
|
var layer = new ol.layer.Vector({
|
||||||
|
source: source
|
||||||
|
});
|
||||||
|
|
||||||
|
layer.setStyle(style);
|
||||||
|
expect(layer.getStyle()).to.be(style);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('dispatches the change event', function(done) {
|
||||||
|
var layer = new ol.layer.Vector({
|
||||||
|
source: source
|
||||||
|
});
|
||||||
|
layer.on('change', function() {
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
layer.setStyle(style);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('updates the internal style function', function() {
|
||||||
|
var layer = new ol.layer.Vector({
|
||||||
|
source: source
|
||||||
|
});
|
||||||
|
expect(layer.getStyleFunction()).to.be(undefined);
|
||||||
|
layer.setStyle(style);
|
||||||
|
expect(layer.getStyleFunction()).to.be.a('function');
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('#getStyle()', function() {
|
||||||
|
|
||||||
|
var source = new ol.source.Vector();
|
||||||
|
var style = new ol.style.Style();
|
||||||
|
|
||||||
|
it('returns what is provided to setStyle', function() {
|
||||||
|
var layer = new ol.layer.Vector({
|
||||||
|
source: source
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(layer.getStyle()).to.be(null);
|
||||||
|
|
||||||
|
layer.setStyle(style);
|
||||||
|
expect(layer.getStyle()).to.be(style);
|
||||||
|
|
||||||
|
layer.setStyle([style]);
|
||||||
|
expect(layer.getStyle()).to.eql([style]);
|
||||||
|
|
||||||
|
var styleFunction = function(feature, resolution) {
|
||||||
|
return [style];
|
||||||
|
};
|
||||||
|
layer.setStyle(styleFunction);
|
||||||
|
expect(layer.getStyle()).to.be(styleFunction);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
goog.require('ol.layer.Layer');
|
goog.require('ol.layer.Layer');
|
||||||
|
|||||||
Reference in New Issue
Block a user