Simplified api

changelog/upgrade-notes.md

@@ -15,17 +15,17 @@ Old syntax:
 
 New syntax:
 ```
-    map.forEachFeatureAtPixel(pixel, callback, callbackThis, {
+    map.forEachFeatureAtPixel(pixel, callback, {
-        layerFilter: layerFilterFn,
+        layerFilter: layerFilterFn
-        layerFilterThis: layerFilterThis
     });
     
     map.hasFeatureAtPixel(pixel, {
-        layerFilter: layerFilterFn,
+        layerFilter: layerFilterFn
-        layerFilterThis: layerFilterThis
     });
 ```
 
+To bind a function to a this, please use the bind method of the function (See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind).
+
 This change is due to the introduction of the `hitTolerance` parameter which can be passed in via this `ol.AtPixelOptions` object, too.
 
 #### Use `view.animate()` instead of `map.beforeRender()` and `ol.animation` functions

externs/olx.js

@@ -306,7 +306,6 @@ olx.MapOptions.prototype.view;
  * Object literal with options for the {@link ol.Map#forEachFeatureAtPixel} and
  * {@link ol.Map#hasFeatureAtPixel} methods.
  * @typedef {{layerFilter: ((function(ol.layer.Layer): boolean)|undefined),
- *    layerFilterThis: (Object|undefined),
  *    hitTolerance: (number|undefined)}}
  */
 olx.AtPixelOptions;
@@ -323,14 +322,6 @@ olx.AtPixelOptions;
 olx.AtPixelOptions.prototype.layerFilter;
 
 
-/**
- * Value to use as `this` when executing `layerFilter`.
- * @type {Object|undefined}
- * @api stable
- */
-olx.AtPixelOptions.prototype.layerFilterThis;
-
-
 /**
  * Hit-detection tolerance. Pixels inside the radius around the given position
  * will be checked for features. This only works for the canvas renderer and
@@ -7684,7 +7675,7 @@ olx.view.FitOptions.prototype.maxZoom;
 
 
 /**
- * The duration of the animation in milliseconds. By default, there is no 
+ * The duration of the animation in milliseconds. By default, there is no
  * animations.
  * @type {number|undefined}
  * @api

src/ol/interaction/select.js

@@ -217,7 +217,7 @@ ol.interaction.Select.handleEvent = function(mapBrowserEvent) {
     // the pixel.
     ol.obj.clear(this.featureLayerAssociation_);
     map.forEachFeatureAtPixel(mapBrowserEvent.pixel,
-        /**
+      (/**
          * @param {ol.Feature|ol.render.Feature} feature Feature.
          * @param {ol.layer.Layer} layer Layer.
          * @return {boolean|undefined} Continue to iterate over the features.
@@ -228,7 +228,7 @@ ol.interaction.Select.handleEvent = function(mapBrowserEvent) {
             this.addFeatureLayerAssociation_(feature, layer);
             return !this.multi_;
           }
-        }, this, {
+        }).bind(this), {
           layerFilter: this.layerFilter_,
           hitTolerance: this.hitTolerance_
         });
@@ -250,7 +250,7 @@ ol.interaction.Select.handleEvent = function(mapBrowserEvent) {
   } else {
     // Modify the currently selected feature(s).
     map.forEachFeatureAtPixel(mapBrowserEvent.pixel,
-        /**
+      (/**
          * @param {ol.Feature|ol.render.Feature} feature Feature.
          * @param {ol.layer.Layer} layer Layer.
          * @return {boolean|undefined} Continue to iterate over the features.
@@ -268,7 +268,7 @@ ol.interaction.Select.handleEvent = function(mapBrowserEvent) {
             }
             return !this.multi_;
           }
-        }, this, {
+        }).bind(this), {
           layerFilter: this.layerFilter_,
           hitTolerance: this.hitTolerance_
         });

src/ol/interaction/translate.js

@@ -203,7 +203,7 @@ ol.interaction.Translate.prototype.featuresAtPixel_ = function(pixel, map) {
             ol.array.includes(this.features_.getArray(), feature)) {
           return feature;
         }
-      }, this, {
+      }.bind(this), {
         layerFilter: this.layerFilter_,
         hitTolerance: this.hitTolerance_
       });

src/ol/map.js

@@ -567,14 +567,13 @@ ol.Map.prototype.disposeInternal = function() {
  *     the {@link ol.layer.Layer layer} of the feature and will be null for
  *     unmanaged layers. To stop detection, callback functions can return a
  *     truthy value.
- * @param {S=} opt_this Value to use as this when executing callback.
  * @param {olx.AtPixelOptions=} opt_options Optional options.
  * @return {T|undefined} Callback result, i.e. the return value of last
  * callback execution, or the first truthy callback return value.
  * @template S,T
  * @api stable
  */
-ol.Map.prototype.forEachFeatureAtPixel = function(pixel, callback, opt_this, opt_options) {
+ol.Map.prototype.forEachFeatureAtPixel = function(pixel, callback, opt_options) {
   if (!this.frameState_) {
     return;
   }
@@ -582,14 +581,11 @@ ol.Map.prototype.forEachFeatureAtPixel = function(pixel, callback, opt_this, opt
   opt_options = opt_options !== undefined ? opt_options : {};
   var hitTolerance = opt_options.hitTolerance !== undefined ?
     opt_options.hitTolerance * this.frameState_.pixelRatio : 0;
-  var thisArg = opt_this !== undefined ? opt_this : null;
   var layerFilter = opt_options.layerFilter !== undefined ?
     opt_options.layerFilter : ol.functions.TRUE;
-  var thisArg2 = opt_options.layerFilterThis !== undefined ?
-    opt_options.layerFilterThis : null;
   return this.renderer_.forEachFeatureAtCoordinate(
-      coordinate, this.frameState_, hitTolerance, callback, thisArg,
+      coordinate, this.frameState_, hitTolerance, callback, null,
-      layerFilter, thisArg2);
+      layerFilter, null);
 };
 
 
@@ -648,12 +644,10 @@ ol.Map.prototype.hasFeatureAtPixel = function(pixel, opt_options) {
   opt_options = opt_options !== undefined ? opt_options : {};
   var layerFilter = opt_options.layerFilter !== undefined ?
       opt_options.layerFilter : ol.functions.TRUE;
-  var thisArg = opt_options.layerFilterThis !== undefined ?
-    opt_options.layerFilterThis : null;
   var hitTolerance = opt_options.hitTolerance !== undefined ?
     opt_options.hitTolerance * this.frameState_.pixelRatio : 0;
   return this.renderer_.hasFeatureAtCoordinate(
-      coordinate, this.frameState_, hitTolerance, layerFilter, thisArg);
+      coordinate, this.frameState_, hitTolerance, layerFilter, null);
 };
 
 

test/spec/ol/renderer/canvas/map.test.js

@@ -111,7 +111,7 @@ describe('ol.renderer.canvas.Map', function() {
       map.addLayer(layer);
       map.renderSync();
       var cb = sinon.spy();
-      map.forEachFeatureAtPixel(map.getPixelFromCoordinate([0, 0]), cb, null, {
+      map.forEachFeatureAtPixel(map.getPixelFromCoordinate([0, 0]), cb, {
         layerFilter: function() {
           return false;
         }
@@ -151,13 +151,13 @@ describe('ol.renderer.canvas.Map', function() {
       ];
 
       for (var i = 0; i < 4; i++) {
-        map.forEachFeatureAtPixel(pixelsInside[i], cb1, null, {hitTolerance:10});
+        map.forEachFeatureAtPixel(pixelsInside[i], cb1, {hitTolerance:10});
       }
       expect(cb1.callCount).to.be(4);
       expect(cb1.firstCall.args[1]).to.be(layer);
 
       for (var j = 0; j < 4; j++) {
-        map.forEachFeatureAtPixel(pixelsOutside[j], cb2, null, {hitTolerance:10});
+        map.forEachFeatureAtPixel(pixelsOutside[j], cb2, {hitTolerance:10});
       }
       expect(cb2).not.to.be.called();
     });