Merge pull request #9960 from ahocevar/lazy-event-calculations

Always dispatch pointermove events, but calculate event pixel and coordinate lazily

src/ol/MapBrowserEvent.js

@@ -32,16 +32,14 @@ class MapBrowserEvent extends MapEvent {
     /**
      * The map pixel relative to the viewport corresponding to the original browser event.
      * @type {import("./pixel.js").Pixel}
-     * @api
      */
-    this.pixel = map.getEventPixel(browserEvent);
+    this.pixel_ = null;
 
     /**
      * The coordinate in view projection corresponding to the original browser event.
      * @type {import("./coordinate.js").Coordinate}
-     * @api
      */
-    this.coordinate = map.getCoordinateFromPixel(this.pixel);
+    this.coordinate_ = null;
 
     /**
      * Indicates if the map is currently being dragged. Only set for
@@ -54,6 +52,36 @@ class MapBrowserEvent extends MapEvent {
 
   }
 
+  /**
+   * The map pixel relative to the viewport corresponding to the original browser event.
+   * @type {import("./pixel.js").Pixel}
+   * @api
+   */
+  get pixel() {
+    if (!this.pixel_) {
+      this.pixel_ = this.map.getEventPixel(this.originalEvent);
+    }
+    return this.pixel_;
+  }
+  set pixel(pixel) {
+    this.pixel_ = pixel;
+  }
+
+  /**
+   * The coordinate in view projection corresponding to the original browser event.
+   * @type {import("./coordinate.js").Coordinate}
+   * @api
+   */
+  get coordinate() {
+    if (!this.coordinate_) {
+      this.coordinate_ = this.map.getCoordinateFromPixel(this.pixel);
+    }
+    return this.coordinate_;
+  }
+  set coordinate(coordinate) {
+    this.coordinate_ = coordinate;
+  }
+
   /**
    * Prevents the default browser action.
    * See https://developer.mozilla.org/en-US/docs/Web/API/event.preventDefault.

src/ol/MapBrowserEventHandler.js

@@ -247,11 +247,9 @@ class MapBrowserEventHandler extends EventTarget {
    * @private
    */
   relayEvent_(pointerEvent) {
-    if (this.map_.hasListener(pointerEvent.type)) {
+    const dragging = !!(this.down_ && this.isMoving_(pointerEvent));
-      const dragging = !!(this.down_ && this.isMoving_(pointerEvent));
+    this.dispatchEvent(new MapBrowserPointerEvent(
-      this.dispatchEvent(new MapBrowserPointerEvent(
+      pointerEvent.type, this.map_, pointerEvent, dragging));
-        pointerEvent.type, this.map_, pointerEvent, dragging));
-    }
   }
 
   /**

src/ol/PluggableMap.js

@@ -40,7 +40,6 @@ import {create as createTransform, apply as applyTransform} from './transform.js
  * @property {import("./transform.js").Transform} coordinateToPixelTransform
  * @property {null|import("./extent.js").Extent} extent
  * @property {Array<DeclutterItems>} declutterItems
- * @property {import("./coordinate.js").Coordinate} focus
  * @property {number} index
  * @property {Array<import("./layer/Layer.js").State>} layerStatesArray
  * @property {number} layerIndex
@@ -345,12 +344,6 @@ class PluggableMap extends BaseObject {
      */
     this.handleResize_;
 
-    /**
-     * @private
-     * @type {import("./coordinate.js").Coordinate}
-     */
-    this.focus_ = null;
-
     /**
      * @private
      * @type {!Array<PostRenderFunction>}
@@ -891,12 +884,13 @@ class PluggableMap extends BaseObject {
     }
     // Prioritize the highest zoom level tiles closest to the focus.
     // Tiles at higher zoom levels are prioritized using Math.log(tileResolution).
-    // Within a zoom level, tiles are prioritized by the distance in pixels
+    // Within a zoom level, tiles are prioritized by the distance in pixels between
-    // between the center of the tile and the focus.  The factor of 65536 means
+    // the center of the tile and the center of the viewport.  The factor of 65536
-    // that the prioritization should behave as desired for tiles up to
+    // means that the prioritization should behave as desired for tiles up to
     // 65536 * Math.log(2) = 45426 pixels from the focus.
-    const deltaX = tileCenter[0] - frameState.focus[0];
+    const center = frameState.viewState.center;
-    const deltaY = tileCenter[1] - frameState.focus[1];
+    const deltaX = tileCenter[0] - center[0];
+    const deltaY = tileCenter[1] - center[1];
     return 65536 * Math.log(tileResolution) +
         Math.sqrt(deltaX * deltaX + deltaY * deltaY) / tileResolution;
   }
@@ -927,7 +921,6 @@ class PluggableMap extends BaseObject {
       }
       target = target.parentElement;
     }
-    this.focus_ = mapBrowserEvent.coordinate;
     mapBrowserEvent.frameState = this.frameState_;
     const interactionsArray = this.getInteractions().getArray();
     if (this.dispatchEvent(mapBrowserEvent) !== false) {
@@ -1229,7 +1222,6 @@ class PluggableMap extends BaseObject {
         coordinateToPixelTransform: this.coordinateToPixelTransform_,
         declutterItems: previousFrameState ? previousFrameState.declutterItems : [],
         extent: getForViewAndSize(viewState.center, viewState.resolution, viewState.rotation, size),
-        focus: this.focus_ ? this.focus_ : viewState.center,
         index: this.frameIndex_++,
         layerIndex: 0,
         layerStatesArray: this.getLayerGroup().getLayerStatesArray(),

src/ol/source/Raster.js

@@ -212,7 +212,6 @@ class RasterSource extends ImageSource {
       animate: false,
       coordinateToPixelTransform: createTransform(),
       extent: null,
-      focus: null,
       index: 0,
       layerIndex: 0,
       layerStatesArray: getLayerStatesArray(this.layers_),
@@ -286,7 +285,6 @@ class RasterSource extends ImageSource {
     const center = getCenter(extent);
 
     frameState.extent = extent.slice();
-    frameState.focus = center;
     frameState.size[0] = Math.round(getWidth(extent) / resolution);
     frameState.size[1] = Math.round(getHeight(extent) / resolution);
     frameState.time = Infinity;