From 7cea6f32406146b869b14d6f72142b6095b8c115 Mon Sep 17 00:00:00 2001 From: Antoine Abt Date: Fri, 21 Feb 2014 11:59:43 +0100 Subject: [PATCH 1/3] Make select interaction create its FeatureOverlay You can now configure it with a `style` option. --- examples/modify-features.js | 5 ++++- examples/select-features.js | 8 +++----- src/objectliterals.jsdoc | 2 +- src/ol/interaction/selectinteraction.exports | 2 +- src/ol/interaction/selectinteraction.js | 10 ++++++---- 5 files changed, 15 insertions(+), 12 deletions(-) diff --git a/examples/modify-features.js b/examples/modify-features.js index ed8bb3714c..b33a76a5b1 100644 --- a/examples/modify-features.js +++ b/examples/modify-features.js @@ -227,12 +227,15 @@ var overlayStyle = (function() { }; })(); +var select = new ol.interaction.Select({ + style: overlayStyle +}); var overlay = new ol.FeatureOverlay({ + features: select.getFeatures(), style: overlayStyle }); var modify = new ol.interaction.Modify({ featureOverlay: overlay }); -var select = new ol.interaction.Select({ featureOverlay: overlay }); var map = new ol.Map({ interactions: ol.interaction.defaults().extend([select, modify]), diff --git a/examples/select-features.js b/examples/select-features.js index def9194a29..4ec79a296a 100644 --- a/examples/select-features.js +++ b/examples/select-features.js @@ -31,11 +31,9 @@ var vector = new ol.layer.Vector({ }); var select = new ol.interaction.Select({ - featureOverlay: new ol.FeatureOverlay({ - style: new ol.style.Style({ - fill: new ol.style.Fill({ - color: 'rgba(255,255,255,0.5)' - }) + style: new ol.style.Style({ + fill: new ol.style.Fill({ + color: 'rgba(255,255,255,0.5)' }) }) }); diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index b8c3cf296b..9d318f297b 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -440,7 +440,7 @@ * features should be selected. * @property {Array.|undefined} layers Layers. Zero or more * layers from which features should be selected. - * @property {ol.FeatureOverlay} featureOverlay Feature overlay. + * @property {ol.style.Style|Array.|ol.feature.StyleFunction|undefined} style FeatureOverlay style. */ /** diff --git a/src/ol/interaction/selectinteraction.exports b/src/ol/interaction/selectinteraction.exports index 57e82dce4b..eeccc7e10a 100644 --- a/src/ol/interaction/selectinteraction.exports +++ b/src/ol/interaction/selectinteraction.exports @@ -1,3 +1,3 @@ @exportSymbol ol.interaction.Select -@exportProperty ol.interaction.Select.prototype.getFeatureOverlay +@exportProperty ol.interaction.Select.prototype.getFeatures @exportProperty ol.interaction.Select.prototype.setMap diff --git a/src/ol/interaction/selectinteraction.js b/src/ol/interaction/selectinteraction.js index d93eb2aa8c..1b6b44104a 100644 --- a/src/ol/interaction/selectinteraction.js +++ b/src/ol/interaction/selectinteraction.js @@ -69,18 +69,20 @@ ol.interaction.Select = function(options) { * @private * @type {ol.FeatureOverlay} */ - this.featureOverlay_ = options.featureOverlay; + this.featureOverlay_ = new ol.FeatureOverlay({ + style: options.style + }); }; goog.inherits(ol.interaction.Select, ol.interaction.Interaction); /** - * @return {ol.FeatureOverlay} Feature overlay. + * @return {ol.Collection} Features collection. * @todo stability experimental */ -ol.interaction.Select.prototype.getFeatureOverlay = function() { - return this.featureOverlay_; +ol.interaction.Select.prototype.getFeatures = function() { + return this.featureOverlay_.getFeatures(); }; From ec832bdf6ef02f6d66eea665647d425d8c822b04 Mon Sep 17 00:00:00 2001 From: Antoine Abt Date: Fri, 21 Feb 2014 12:35:30 +0100 Subject: [PATCH 2/3] Modify interaction takes style & features options Instead of a FeatureOverlay --- examples/modify-features.js | 6 ++---- src/objectliterals.jsdoc | 3 ++- src/ol/interaction/modifyinteraction.js | 18 +++++++++++++----- 3 files changed, 17 insertions(+), 10 deletions(-) diff --git a/examples/modify-features.js b/examples/modify-features.js index b33a76a5b1..28ae111367 100644 --- a/examples/modify-features.js +++ b/examples/modify-features.js @@ -1,4 +1,3 @@ -goog.require('ol.FeatureOverlay'); goog.require('ol.Map'); goog.require('ol.View2D'); goog.require('ol.interaction'); @@ -230,13 +229,12 @@ var overlayStyle = (function() { var select = new ol.interaction.Select({ style: overlayStyle }); -var overlay = new ol.FeatureOverlay({ + +var modify = new ol.interaction.Modify({ features: select.getFeatures(), style: overlayStyle }); -var modify = new ol.interaction.Modify({ featureOverlay: overlay }); - var map = new ol.Map({ interactions: ol.interaction.defaults().extend([select, modify]), layers: [raster, vectorLayer], diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 9d318f297b..566108902a 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -454,7 +454,8 @@ * @typedef {Object} olx.interaction.ModifyOptions * @property {number|undefined} pixelTolerance Pixel tolerance for considering * the pointer close enough to a vertex for editing. Default is 20 pixels. - * @property {ol.FeatureOverlay} featureOverlay Features overlay. + * @property {ol.style.Style|Array.|ol.feature.StyleFunction|undefined} style FeatureOverlay style. + * @property {ol.Collection} features The features the interaction works on. */ /** diff --git a/src/ol/interaction/modifyinteraction.js b/src/ol/interaction/modifyinteraction.js index e1de03bdba..3de50be901 100644 --- a/src/ol/interaction/modifyinteraction.js +++ b/src/ol/interaction/modifyinteraction.js @@ -2,6 +2,7 @@ goog.provide('ol.interaction.Modify'); goog.require('goog.array'); goog.require('goog.asserts'); +goog.require('goog.events'); goog.require('ol.Collection'); goog.require('ol.CollectionEventType'); goog.require('ol.Feature'); @@ -85,11 +86,19 @@ ol.interaction.Modify = function(options) { * @type {ol.FeatureOverlay} * @private */ - this.overlay_ = options.featureOverlay; + this.overlay_ = new ol.FeatureOverlay({ + style: options.style + }); - this.overlay_.getFeatures().listen(ol.CollectionEventType.ADD, + /** + * @type {ol.Collection} + * @private + */ + this.features_ = options.features; + + goog.events.listen(this.features_, ol.CollectionEventType.ADD, this.addFeature_, false, this); - this.overlay_.getFeatures().listen(ol.CollectionEventType.REMOVE, + goog.events.listen(this.features_, ol.CollectionEventType.REMOVE, this.removeFeature_, false, this); /** @@ -315,8 +324,7 @@ ol.interaction.Modify.prototype.removeFeature_ = function(evt) { } // There remains only vertexFeature… if (!goog.isNull(this.vertexFeature_) && - this.overlay_.getFeatures().getLength() === 1 && - this.overlay_.getFeatures().getAt(0) == this.vertexFeature_) { + this.features_.getLength() === 0) { this.overlay_.removeFeature(this.vertexFeature_); this.vertexFeature_ = null; } From a971928bbebf19dbfb857b7e2d173c3770919936 Mon Sep 17 00:00:00 2001 From: Antoine Abt Date: Fri, 21 Feb 2014 13:41:07 +0100 Subject: [PATCH 3/3] Add features option to draw interaction --- src/objectliterals.jsdoc | 3 ++- src/ol/interaction/drawinteraction.js | 10 ++++++++++ 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 566108902a..0016c4f946 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -388,7 +388,8 @@ /** * @typedef {Object} olx.interaction.DrawOptions - * @property {ol.source.Vector|undefined} source Destination source for the features. + * @property {ol.Collection|undefined} features Destination collection for the drawn features. + * @property {ol.source.Vector|undefined} source Destination source for the drawn features. * @property {number|undefined} snapTolerance Pixel distance for snapping to the * drawing finish (default is 12). * @property {ol.geom.GeometryType} type Drawing type ('Point', 'LineString', diff --git a/src/ol/interaction/drawinteraction.js b/src/ol/interaction/drawinteraction.js index 9a263bc38b..7c357ad51f 100644 --- a/src/ol/interaction/drawinteraction.js +++ b/src/ol/interaction/drawinteraction.js @@ -74,6 +74,13 @@ ol.interaction.Draw = function(options) { */ this.source_ = goog.isDef(options.source) ? options.source : null; + /** + * Target collection for drawn features. + * @type {ol.Collection} + * @private + */ + this.features_ = goog.isDef(options.features) ? options.features : null; + /** * Pixel distance for snapping. * @type {number} @@ -473,6 +480,9 @@ ol.interaction.Draw.prototype.finishDrawing_ = function(event) { sketchFeature.setGeometry(new ol.geom.MultiPolygon([coordinates])); } + if (!goog.isNull(this.features_)) { + this.features_.push(sketchFeature); + } if (!goog.isNull(this.source_)) { this.source_.addFeature(sketchFeature); }