UNPKG

openlayers

Version:

Build tools and sources for developing OpenLayers based mapping applications

400 lines (341 loc) 9.35 kB
goog.provide('ol.style.Style'); goog.require('ol.asserts'); goog.require('ol.geom.GeometryType'); goog.require('ol.style.Circle'); goog.require('ol.style.Fill'); goog.require('ol.style.Stroke'); /** * @classdesc * Container for vector feature rendering styles. Any changes made to the style * or its children through `set*()` methods will not take effect until the * feature or layer that uses the style is re-rendered. * * @constructor * @struct * @param {olx.style.StyleOptions=} opt_options Style options. * @api */ ol.style.Style = function(opt_options) { var options = opt_options || {}; /** * @private * @type {string|ol.geom.Geometry|ol.StyleGeometryFunction} */ this.geometry_ = null; /** * @private * @type {!ol.StyleGeometryFunction} */ this.geometryFunction_ = ol.style.Style.defaultGeometryFunction; if (options.geometry !== undefined) { this.setGeometry(options.geometry); } /** * @private * @type {ol.style.Fill} */ this.fill_ = options.fill !== undefined ? options.fill : null; /** * @private * @type {ol.style.Image} */ this.image_ = options.image !== undefined ? options.image : null; /** * @private * @type {ol.style.Stroke} */ this.stroke_ = options.stroke !== undefined ? options.stroke : null; /** * @private * @type {ol.style.Text} */ this.text_ = options.text !== undefined ? options.text : null; /** * @private * @type {number|undefined} */ this.zIndex_ = options.zIndex; }; /** * Clones the style. * @return {ol.style.Style} The cloned style. * @api */ ol.style.Style.prototype.clone = function() { var geometry = this.getGeometry(); if (geometry && geometry.clone) { geometry = geometry.clone(); } return new ol.style.Style({ geometry: geometry, fill: this.getFill() ? this.getFill().clone() : undefined, image: this.getImage() ? this.getImage().clone() : undefined, stroke: this.getStroke() ? this.getStroke().clone() : undefined, text: this.getText() ? this.getText().clone() : undefined, zIndex: this.getZIndex() }); }; /** * Get the geometry to be rendered. * @return {string|ol.geom.Geometry|ol.StyleGeometryFunction} * Feature property or geometry or function that returns the geometry that will * be rendered with this style. * @api */ ol.style.Style.prototype.getGeometry = function() { return this.geometry_; }; /** * Get the function used to generate a geometry for rendering. * @return {!ol.StyleGeometryFunction} Function that is called with a feature * and returns the geometry to render instead of the feature's geometry. * @api */ ol.style.Style.prototype.getGeometryFunction = function() { return this.geometryFunction_; }; /** * Get the fill style. * @return {ol.style.Fill} Fill style. * @api */ ol.style.Style.prototype.getFill = function() { return this.fill_; }; /** * Set the fill style. * @param {ol.style.Fill} fill Fill style. * @api */ ol.style.Style.prototype.setFill = function(fill) { this.fill_ = fill; }; /** * Get the image style. * @return {ol.style.Image} Image style. * @api */ ol.style.Style.prototype.getImage = function() { return this.image_; }; /** * Set the image style. * @param {ol.style.Image} image Image style. * @api */ ol.style.Style.prototype.setImage = function(image) { this.image_ = image; }; /** * Get the stroke style. * @return {ol.style.Stroke} Stroke style. * @api */ ol.style.Style.prototype.getStroke = function() { return this.stroke_; }; /** * Set the stroke style. * @param {ol.style.Stroke} stroke Stroke style. * @api */ ol.style.Style.prototype.setStroke = function(stroke) { this.stroke_ = stroke; }; /** * Get the text style. * @return {ol.style.Text} Text style. * @api */ ol.style.Style.prototype.getText = function() { return this.text_; }; /** * Set the text style. * @param {ol.style.Text} text Text style. * @api */ ol.style.Style.prototype.setText = function(text) { this.text_ = text; }; /** * Get the z-index for the style. * @return {number|undefined} ZIndex. * @api */ ol.style.Style.prototype.getZIndex = function() { return this.zIndex_; }; /** * Set a geometry that is rendered instead of the feature's geometry. * * @param {string|ol.geom.Geometry|ol.StyleGeometryFunction} geometry * Feature property or geometry or function returning a geometry to render * for this style. * @api */ ol.style.Style.prototype.setGeometry = function(geometry) { if (typeof geometry === 'function') { this.geometryFunction_ = geometry; } else if (typeof geometry === 'string') { this.geometryFunction_ = function(feature) { return /** @type {ol.geom.Geometry} */ (feature.get(geometry)); }; } else if (!geometry) { this.geometryFunction_ = ol.style.Style.defaultGeometryFunction; } else if (geometry !== undefined) { this.geometryFunction_ = function() { return /** @type {ol.geom.Geometry} */ (geometry); }; } this.geometry_ = geometry; }; /** * Set the z-index. * * @param {number|undefined} zIndex ZIndex. * @api */ ol.style.Style.prototype.setZIndex = function(zIndex) { this.zIndex_ = zIndex; }; /** * Convert the provided object into a style function. Functions passed through * unchanged. Arrays of ol.style.Style or single style objects wrapped in a * new style function. * @param {ol.StyleFunction|Array.<ol.style.Style>|ol.style.Style} obj * A style function, a single style, or an array of styles. * @return {ol.StyleFunction} A style function. */ ol.style.Style.createFunction = function(obj) { var styleFunction; if (typeof obj === 'function') { styleFunction = obj; } else { /** * @type {Array.<ol.style.Style>} */ var styles; if (Array.isArray(obj)) { styles = obj; } else { ol.asserts.assert(obj instanceof ol.style.Style, 41); // Expected an `ol.style.Style` or an array of `ol.style.Style` styles = [obj]; } styleFunction = function() { return styles; }; } return styleFunction; }; /** * @type {Array.<ol.style.Style>} * @private */ ol.style.Style.default_ = null; /** * @param {ol.Feature|ol.render.Feature} feature Feature. * @param {number} resolution Resolution. * @return {Array.<ol.style.Style>} Style. */ ol.style.Style.defaultFunction = function(feature, resolution) { // We don't use an immediately-invoked function // and a closure so we don't get an error at script evaluation time in // browsers that do not support Canvas. (ol.style.Circle does // canvas.getContext('2d') at construction time, which will cause an.error // in such browsers.) if (!ol.style.Style.default_) { var fill = new ol.style.Fill({ color: 'rgba(255,255,255,0.4)' }); var stroke = new ol.style.Stroke({ color: '#3399CC', width: 1.25 }); ol.style.Style.default_ = [ new ol.style.Style({ image: new ol.style.Circle({ fill: fill, stroke: stroke, radius: 5 }), fill: fill, stroke: stroke }) ]; } return ol.style.Style.default_; }; /** * Default styles for editing features. * @return {Object.<ol.geom.GeometryType, Array.<ol.style.Style>>} Styles */ ol.style.Style.createDefaultEditing = function() { /** @type {Object.<ol.geom.GeometryType, Array.<ol.style.Style>>} */ var styles = {}; var white = [255, 255, 255, 1]; var blue = [0, 153, 255, 1]; var width = 3; styles[ol.geom.GeometryType.POLYGON] = [ new ol.style.Style({ fill: new ol.style.Fill({ color: [255, 255, 255, 0.5] }) }) ]; styles[ol.geom.GeometryType.MULTI_POLYGON] = styles[ol.geom.GeometryType.POLYGON]; styles[ol.geom.GeometryType.LINE_STRING] = [ new ol.style.Style({ stroke: new ol.style.Stroke({ color: white, width: width + 2 }) }), new ol.style.Style({ stroke: new ol.style.Stroke({ color: blue, width: width }) }) ]; styles[ol.geom.GeometryType.MULTI_LINE_STRING] = styles[ol.geom.GeometryType.LINE_STRING]; styles[ol.geom.GeometryType.CIRCLE] = styles[ol.geom.GeometryType.POLYGON].concat( styles[ol.geom.GeometryType.LINE_STRING] ); styles[ol.geom.GeometryType.POINT] = [ new ol.style.Style({ image: new ol.style.Circle({ radius: width * 2, fill: new ol.style.Fill({ color: blue }), stroke: new ol.style.Stroke({ color: white, width: width / 2 }) }), zIndex: Infinity }) ]; styles[ol.geom.GeometryType.MULTI_POINT] = styles[ol.geom.GeometryType.POINT]; styles[ol.geom.GeometryType.GEOMETRY_COLLECTION] = styles[ol.geom.GeometryType.POLYGON].concat( styles[ol.geom.GeometryType.LINE_STRING], styles[ol.geom.GeometryType.POINT] ); return styles; }; /** * Function that is called with a feature and returns its default geometry. * @param {ol.Feature|ol.render.Feature} feature Feature to get the geometry * for. * @return {ol.geom.Geometry|ol.render.Feature|undefined} Geometry to render. */ ol.style.Style.defaultGeometryFunction = function(feature) { return feature.getGeometry(); };