Merge pull request #11019 from mike-000/patch-10

Option to disable image smoothing for Image layer sources

src/ol/renderer/canvas/ImageLayer.js

@@ -4,6 +4,7 @@
 import CanvasLayerRenderer from './Layer.js';
 import ViewHint from '../../ViewHint.js';
 import {ENABLE_RASTER_REPROJECTION} from '../../reproj/common.js';
+import {assign} from '../../obj.js';
 import {compose as composeTransform, makeInverse} from '../../transform.js';
 import {containsExtent, intersects} from '../../extent.js';
 import {createTransformString} from '../../render/canvas.js';
@@ -180,6 +181,7 @@ class CanvasImageLayerRenderer extends CanvasLayerRenderer {
     const dw = img.width * transform[0];
     const dh = img.height * transform[3];
 
+    assign(context, this.getLayer().getSource().getContextOptions());
     this.preRender(context, frameState);
     if (dw >= 0.5 && dh >= 0.5) {
       const opacity = layerState.opacity;

src/ol/reproj/Image.js

@@ -32,6 +32,7 @@ class ReprojImage extends ImageBase {
    * @param {number} pixelRatio Pixel ratio.
    * @param {FunctionType} getImageFunction
    *     Function returning source images (extent, resolution, pixelRatio).
+   * @param {object=} opt_contextOptions Properties to set on the canvas context.
    */
   constructor(
     sourceProj,
@@ -39,7 +40,8 @@ class ReprojImage extends ImageBase {
     targetExtent,
     targetResolution,
     pixelRatio,
-    getImageFunction
+    getImageFunction,
+    opt_contextOptions
   ) {
     const maxSourceExtent = sourceProj.getExtent();
     const maxTargetExtent = targetProj.getExtent();
@@ -120,6 +122,12 @@ class ReprojImage extends ImageBase {
      */
     this.sourcePixelRatio_ = sourcePixelRatio;
 
+    /**
+     * @private
+     * @type {object}
+     */
+    this.contextOptions_ = opt_contextOptions;
+
     /**
      * @private
      * @type {HTMLCanvasElement}
@@ -181,7 +189,9 @@ class ReprojImage extends ImageBase {
             image: this.sourceImage_.getImage(),
           },
         ],
-        0
+        0,
+        undefined,
+        this.contextOptions_
       );
     }
     this.state = sourceState;

src/ol/source/Image.js

@@ -6,6 +6,7 @@ import ImageState from '../ImageState.js';
 import ReprojImage from '../reproj/Image.js';
 import Source from './Source.js';
 import {ENABLE_RASTER_REPROJECTION} from '../reproj/common.js';
+import {IMAGE_SMOOTHING_DISABLED} from './common.js';
 import {abstract} from '../util.js';
 import {equals} from '../extent.js';
 import {equivalent} from '../proj.js';
@@ -62,6 +63,7 @@ export class ImageSourceEvent extends Event {
 /**
  * @typedef {Object} Options
  * @property {import("./Source.js").AttributionLike} [attributions]
+ * @property {boolean} [imageSmoothing=true] Enable image smoothing.
  * @property {import("../proj.js").ProjectionLike} [projection]
  * @property {Array<number>} [resolutions]
  * @property {import("./State.js").default} [state]
@@ -105,6 +107,13 @@ class ImageSource extends Source {
      * @type {number}
      */
     this.reprojectedRevision_ = 0;
+
+    /**
+     * @private
+     * @type {object|undefined}
+     */
+    this.contextOptions_ =
+      options.imageSmoothing === false ? IMAGE_SMOOTHING_DISABLED : undefined;
   }
 
   /**
@@ -114,6 +123,13 @@ class ImageSource extends Source {
     return this.resolutions_;
   }
 
+  /**
+   * @return {Object|undefined} Context options.
+   */
+  getContextOptions() {
+    return this.contextOptions_;
+  }
+
   /**
    * @protected
    * @param {number} resolution Resolution.
@@ -173,7 +189,8 @@ class ImageSource extends Source {
             pixelRatio,
             sourceProjection
           );
-        }.bind(this)
+        }.bind(this),
+        this.contextOptions_
       );
       this.reprojectedRevision_ = this.getRevision();
 

src/ol/source/ImageArcGISRest.js

@@ -20,6 +20,7 @@ import {containsExtent, getHeight, getWidth} from '../extent.js';
  * the remote server.
  * @property {import("../Image.js").LoadFunction} [imageLoadFunction] Optional function to load an image given
  * a URL.
+ * @property {boolean} [imageSmoothing=true] Enable image smoothing.
  * @property {Object<string,*>} [params] ArcGIS Rest parameters. This field is optional. Service
  * defaults will be used for any fields not specified. `FORMAT` is `PNG32` by default. `F` is
  * `IMAGE` by default. `TRANSPARENT` is `true` by default.  `BBOX`, `SIZE`, `BBOXSR`, and `IMAGESR`
@@ -56,6 +57,7 @@ class ImageArcGISRest extends ImageSource {
 
     super({
       attributions: options.attributions,
+      imageSmoothing: options.imageSmoothing,
       projection: options.projection,
       resolutions: options.resolutions,
     });

src/ol/source/ImageCanvas.js

@@ -36,6 +36,7 @@ import {
  * the value returned by the function is later changed then
  * `changed` should be called on the source for the source to
  * invalidate the current cached image. See: {@link module:ol/Observable~Observable#changed}
+ * @property {boolean} [imageSmoothing=true] Enable image smoothing.
  * @property {import("../proj.js").ProjectionLike} [projection] Projection. Default is the view projection.
  * @property {number} [ratio=1.5] Ratio. 1 means canvases are the size of the map viewport, 2 means twice the
  * width and height of the map viewport, and so on. Must be `1` or higher.
@@ -58,6 +59,7 @@ class ImageCanvasSource extends ImageSource {
 
     super({
       attributions: options.attributions,
+      imageSmoothing: options.imageSmoothing,
       projection: options.projection,
       resolutions: options.resolutions,
       state: options.state,

src/ol/source/ImageMapGuide.js

@@ -32,6 +32,7 @@ import {
  * @property {Array<number>} [resolutions] Resolutions.
  * If specified, requests will be made for these resolutions only.
  * @property {import("../Image.js").LoadFunction} [imageLoadFunction] Optional function to load an image given a URL.
+ * @property {boolean} [imageSmoothing=true] Enable image smoothing.
  * @property {Object} [params] Additional parameters.
  */
 
@@ -48,6 +49,7 @@ class ImageMapGuide extends ImageSource {
    */
   constructor(options) {
     super({
+      imageSmoothing: options.imageSmoothing,
       projection: options.projection,
       resolutions: options.resolutions,
     });

src/ol/source/ImageStatic.js

@@ -19,6 +19,7 @@ import {get as getProjection} from '../proj.js';
  * @property {import("../extent.js").Extent} [imageExtent] Extent of the image in map coordinates.
  * This is the [left, bottom, right, top] map coordinates of your image.
  * @property {import("../Image.js").LoadFunction} [imageLoadFunction] Optional function to load an image given a URL.
+ * @property {boolean} [imageSmoothing=true] Enable image smoothing.
  * @property {import("../proj.js").ProjectionLike} [projection] Projection. Default is the view projection.
  * @property {import("../size.js").Size} [imageSize] Size of the image in pixels. Usually the image size is auto-detected, so this
  * only needs to be set if auto-detection fails for some reason.
@@ -45,6 +46,7 @@ class Static extends ImageSource {
 
     super({
       attributions: options.attributions,
+      imageSmoothing: options.imageSmoothing,
       projection: getProjection(options.projection),
     });
 

src/ol/source/ImageWMS.js

@@ -39,6 +39,7 @@ const GETFEATUREINFO_IMAGE_SIZE = [101, 101];
  * @property {import("./WMSServerType.js").default|string} [serverType] The type of
  * the remote WMS server: `mapserver`, `geoserver` or `qgis`. Only needed if `hidpi` is `true`.
  * @property {import("../Image.js").LoadFunction} [imageLoadFunction] Optional function to load an image given a URL.
+ * @property {boolean} [imageSmoothing=true] Enable image smoothing.
  * @property {Object<string,*>} params WMS request parameters.
  * At least a `LAYERS` param is required. `STYLES` is
  * `''` by default. `VERSION` is `1.3.0` by default. `WIDTH`, `HEIGHT`, `BBOX`
@@ -68,6 +69,7 @@ class ImageWMS extends ImageSource {
 
     super({
       attributions: options.attributions,
+      imageSmoothing: options.imageSmoothing,
       projection: options.projection,
       resolutions: options.resolutions,
     });

src/ol/source/Source.js

@@ -140,6 +140,13 @@ class Source extends BaseObject {
     return this.wrapX_;
   }
 
+  /**
+   * @return {Object|undefined} Context options.
+   */
+  getContextOptions() {
+    return undefined;
+  }
+
   /**
    * Refreshes the source. The source will be cleared, and data from the server will be reloaded.
    * @api

src/ol/source/Tile.js

@@ -173,13 +173,6 @@ class TileSource extends Source {
     return covered;
   }
 
-  /**
-   * @return {Object|undefined} Context options.
-   */
-  getContextOptions() {
-    return undefined;
-  }
-
   /**
    * @param {import("../proj/Projection.js").default} projection Projection.
    * @return {number} Gutter.