ol-stac 1.2.0 → 1.4.0

package/README.md

@@ -15,7 +15,21 @@ Explore the examples to get started with some more code:
 Dig into the API documentation for all details:
 <https://ol-stac.moregeo.it/en/latest/apidoc/>
 
-**ol-stac requires OpenLayers version >=7.5.2**
+### OpenLayers versions
+
+ol-stac works best with OpenLayers >= 10.9.0.
+
+It should work with older versions >= 9.0.0, but certain features will be unavailable
+or work less reliably, for example:
+
+- Better per-band visualization of GeoTiff files (requires >= 10.9.0)
+- Automatic loading of missing projections for GeoTiff files (EPSG code retrieval requires >= 10.0.0, other projection codes require >= 10.8.0)
+- GeoZARR support (requires >= 10.8.0)
+
+Generally, we highly recommend to use OpenLayers >= 10.9.0.
+If you use an older version, please ensure it works well for your usecases.
+
+Older versions of ol-stac (< 1.3.0) support OpenLayers >= 7.5.2.
 
 ## Sponsors
 

package/layer/STAC.d.ts

@@ -1,7 +1,10 @@
 export default STACLayer;
 export type Extent = import("ol/extent.js").Extent;
 export type Layer = import("ol/layer/Layer.js").default;
+export type APICollection = any;
 export type Link = any;
+export type STAC = any;
+export type STACObject = any;
 export type Map = import("ol/Map.js").default;
 export type Style = import('ol/style/Style.js').default;
 export type SourceOptions = import('../source/type.js').SourceOptions;
@@ -35,9 +38,9 @@ export type Options = {
      */
     assets?: any[] | null | undefined;
     /**
-     * The (one-based) bands to show.
+     * The bands to show. One-based index of the band, or the name of the band.
      */
-    bands?: number[] | undefined;
+    bands?: (string | number)[] | undefined;
     /**
      * Optional function that can be used to configure the underlying sources. The function can do any additional work
      * and return the completed options or a promise for the same. The function will be called with the current source options
@@ -64,7 +67,7 @@ export type Options = {
      */
     displayPreview?: boolean | undefined;
     /**
-     * Allow to display COGs and, if `displayGeoTiffByDefault` is enabled, GeoTiffs,
+     * Allow to display COGs/WOZs and, if `displayGeoTiffByDefault` is enabled, GeoTiffs,
      * usually an asset with role `overview` or `visual`.
      */
     displayOverview?: boolean | undefined;
@@ -77,6 +80,10 @@ export type Options = {
      * To disable the functionality set this to `false`.
      */
     displayWebMapLink?: string | boolean | any[] | undefined;
+    /**
+     * The style for GeoTIFF and GeoZarr layers (WebGLTileLayer style).
+     */
+    style?: import("ol/layer/WebGLTile.js").Style | null | undefined;
     /**
      * The style for the overall bounds / footprint.
      */
@@ -164,9 +171,18 @@ export type Options = {
 /**
  * @typedef {import("ol/layer/Layer.js").default} Layer
  */
+/**
+ * @typedef {import('stac-js').APICollection} APICollection
+ */
 /**
  * @typedef {import("stac-js").Link} Link
  */
+/**
+ * @typedef {import('stac-js').STAC} STAC
+ */
+/**
+ * @typedef {import('stac-js').STACObject} STACObject
+ */
 /**
  * @typedef {import("ol/Map.js").default} Map
  */
@@ -191,7 +207,7 @@ export type Options = {
  * only for STAC Items and Collections.
  * This can be an array of strings corresponding to asset keys or Asset objects.
  * null shows the default asset, an empty array shows no asset.
- * @property {Array<number>} [bands] The (one-based) bands to show.
+ * @property {Array<number|string>} [bands] The bands to show. One-based index of the band, or the name of the band.
  * @property {function(SourceType, SourceOptions, (Asset|Link)):(SourceOptions|Promise<SourceOptions>)} [getSourceOptions]
  * Optional function that can be used to configure the underlying sources. The function can do any additional work
  * and return the completed options or a promise for the same. The function will be called with the current source options
@@ -206,7 +222,7 @@ export type Options = {
  * i.e. assets with any of the roles `thumbnail`, `overview`, or a link with relation type `preview`.
  * The previews are usually not covering the full extents and as such may be placed incorrectly on the map.
  * For performance reasons, it is recommended to enable this option if you pass in STAC API Items instead of `displayOverview`.
- * @property {boolean} [displayOverview=true] Allow to display COGs and, if `displayGeoTiffByDefault` is enabled, GeoTiffs,
+ * @property {boolean} [displayOverview=true] Allow to display COGs/WOZs and, if `displayGeoTiffByDefault` is enabled, GeoTiffs,
  * usually an asset with role `overview` or `visual`.
  * @property {string|boolean|Array<Link|string>} [displayWebMapLink=false] Allow to display a layer
  * based on the information provided through the web map links extension.
@@ -214,6 +230,7 @@ export type Options = {
  * If set to true or to a specific type of web map link (`pmtiles`, `tilejson`, `wms`, `wmts`, `xyz`),
  * it lets this library choose a web map link to show, but only if no other data is shown.
  * To disable the functionality set this to `false`.
+ * @property {import("ol/layer/WebGLTile.js").Style|null} [style=null] The style for GeoTIFF and GeoZarr layers (WebGLTileLayer style).
  * @property {Style} [boundsStyle] The style for the overall bounds / footprint.
  * @property {Style} [collectionStyle] The style for individual children in a list of STAC Items or Collections.
  * @property {null|string} [crossOrigin] For thumbnails: The `crossOrigin` attribute for loaded images / tiles.
@@ -283,7 +300,7 @@ declare class STACLayer extends LayerGroup {
      */
     private assets_;
     /**
-     * @type {Array<number>}
+     * @type {Array<number|string>}
      * @private
      */
     private bands_;
@@ -326,6 +343,11 @@ declare class STACLayer extends LayerGroup {
      * @private
      */
     private useTileLayerAsFallback_;
+    /**
+     * @type {import("ol/layer/WebGLTile.js").Style|null}
+     * @private
+     */
+    private style_;
     /**
      * @type {Style}
      * @private
@@ -389,7 +411,7 @@ declare class STACLayer extends LayerGroup {
      * @param {string} url The url to the data.
      * @param {APICollection|Object|Array<STAC>|string|null} children The child STAC entities to show.
      * @param {Array<Asset|string>|null} assets The assets to show.
-     * @param {Array<number>} bands The (one-based) bands to show.
+     * @param {Array<number|string>} bands The bands to show.
      * @private
      */
     private configure_;
@@ -452,7 +474,7 @@ declare class STACLayer extends LayerGroup {
     private addTileLayerForImagery_;
     /**
      * @param {Layer|LayerGroup} [layer] A Layer to add to the LayerGroup
-     * @param {import("stac-js").STACObject} [data] The STAC object, can be any class exposed by stac-js
+     * @param {STACObject} [data] The STAC object, can be any class exposed by stac-js
      * @param {number} [zIndex] The z-index for the layer
      * @private
      */
@@ -485,6 +507,7 @@ declare class STACLayer extends LayerGroup {
      * @private
      */
     private addLabelExtension_;
+    addGeoZarr_(asset: any): Promise<WebGLTileLayer | TileLayer<import("ol/source/Tile.js").default<import("ol/Tile.js").default>> | undefined>;
     /**
      * Update the layers shown manually based on the current configuration.
      * Usually this doesn't need to be called manually.
@@ -505,6 +528,12 @@ declare class STACLayer extends LayerGroup {
      * @api
      */
     getWebMapLinks(): Array<Link>;
+    /**
+     * Set the style for GeoTIFF and GeoZarr layers (WebGLTileLayer style).
+     * @param {import("ol/layer/WebGLTile.js").Style|null} style The style to apply.
+     * @api
+     */
+    setStyle(style: import("ol/layer/WebGLTile.js").Style | null): void;
     /**
      * Update the assets to be rendered.
      * @param {Array<string|Asset>|null} assets The assets to show.
@@ -571,4 +600,6 @@ declare class STACLayer extends LayerGroup {
 import SourceType from '../source/type.js';
 import LayerGroup from 'ol/layer/Group.js';
 import VectorLayer from 'ol/layer/Vector.js';
+import WebGLTileLayer from 'ol/layer/WebGLTile.js';
+import TileLayer from 'ol/layer/Tile.js';
 //# sourceMappingURL=STAC.d.ts.map

package/layer/STAC.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"STAC.d.ts","sourceRoot":"","sources":["../../../src/ol/layer/STAC.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"STAC.d.ts","sourceRoot":"","sources":["../../../src/ol/layer/STAC.js"],"names":[],"mappings":"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"}

package/layer/STAC.js

@@ -11,7 +11,7 @@ import VectorLayer from 'ol/layer/Vector.js';
 import VectorTileLayer from 'ol/layer/VectorTile.js';
 import WebGLTileLayer from 'ol/layer/WebGLTile.js';
 import { transformExtent } from 'ol/proj.js';
-// import GeoTIFF from 'ol/source/GeoTIFF.js';
+import GeoTIFF from 'ol/source/GeoTIFF.js';
 import StaticImage from 'ol/source/ImageStatic.js';
 import TileJSON from 'ol/source/TileJSON.js';
 import WMS from 'ol/source/TileWMS.js';
@@ -21,24 +21,32 @@ import WMTS, { optionsFromCapabilities } from 'ol/source/WMTS.js';
 import XYZ from 'ol/source/XYZ.js';
 import { PMTilesRasterSource, PMTilesVectorSource } from 'ol-pmtiles';
 import * as pmtiles from 'pmtiles';
-import create, { APICollection, Asset, CollectionCollection, Item, ItemCollection, STAC, } from 'stac-js';
+import create, { Asset } from 'stac-js';
 import { fixGeoJson, toGeoJSON, unionBoundingBox } from 'stac-js/src/geo.js';
-import { geojsonMediaType } from 'stac-js/src/mediatypes.js';
+import { geojsonMediaType, geotiffMediaTypes, wozMediaTypes, } from 'stac-js/src/mediatypes.js';
 import { isObject } from 'stac-js/src/utils.js';
 import ErrorEvent from '../events/ErrorEvent.js';
-// todo: temporary fix for https://github.com/openlayers/openlayers/issues/17153
-import GeoTIFF from '../source/GeoTIFF.js';
+import { getProjection } from '../proj.js';
 import SourceType from '../source/type.js';
-import { LABEL_EXTENSION, defaultBoundsStyle, defaultCollectionStyle, getBoundsStyle, getClassificationStyle, getGeoTiffSourceInfoFromAsset, getProjection, getSpecificWebMapUrl, isScalar, } from '../util.js';
+import { LABEL_EXTENSION, defaultBoundsStyle, defaultCollectionStyle, getBoundsStyle, getClassificationStyle, getGeoTiffSourceInfoFromAsset, getGeoZarrSourceOptionsFromAsset, getSpecificWebMapUrl, isScalar, } from '../util.js';
 /**
  * @typedef {import("ol/extent.js").Extent} Extent
  */
 /**
  * @typedef {import("ol/layer/Layer.js").default} Layer
  */
+/**
+ * @typedef {import('stac-js').APICollection} APICollection
+ */
 /**
  * @typedef {import("stac-js").Link} Link
  */
+/**
+ * @typedef {import('stac-js').STAC} STAC
+ */
+/**
+ * @typedef {import('stac-js').STACObject} STACObject
+ */
 /**
  * @typedef {import("ol/Map.js").default} Map
  */
@@ -63,7 +71,7 @@ import { LABEL_EXTENSION, defaultBoundsStyle, defaultCollectionStyle, getBoundsS
  * only for STAC Items and Collections.
  * This can be an array of strings corresponding to asset keys or Asset objects.
  * null shows the default asset, an empty array shows no asset.
- * @property {Array<number>} [bands] The (one-based) bands to show.
+ * @property {Array<number|string>} [bands] The bands to show. One-based index of the band, or the name of the band.
  * @property {function(SourceType, SourceOptions, (Asset|Link)):(SourceOptions|Promise<SourceOptions>)} [getSourceOptions]
  * Optional function that can be used to configure the underlying sources. The function can do any additional work
  * and return the completed options or a promise for the same. The function will be called with the current source options
@@ -78,7 +86,7 @@ import { LABEL_EXTENSION, defaultBoundsStyle, defaultCollectionStyle, getBoundsS
  * i.e. assets with any of the roles `thumbnail`, `overview`, or a link with relation type `preview`.
  * The previews are usually not covering the full extents and as such may be placed incorrectly on the map.
  * For performance reasons, it is recommended to enable this option if you pass in STAC API Items instead of `displayOverview`.
- * @property {boolean} [displayOverview=true] Allow to display COGs and, if `displayGeoTiffByDefault` is enabled, GeoTiffs,
+ * @property {boolean} [displayOverview=true] Allow to display COGs/WOZs and, if `displayGeoTiffByDefault` is enabled, GeoTiffs,
  * usually an asset with role `overview` or `visual`.
  * @property {string|boolean|Array<Link|string>} [displayWebMapLink=false] Allow to display a layer
  * based on the information provided through the web map links extension.
@@ -86,6 +94,7 @@ import { LABEL_EXTENSION, defaultBoundsStyle, defaultCollectionStyle, getBoundsS
  * If set to true or to a specific type of web map link (`pmtiles`, `tilejson`, `wms`, `wmts`, `xyz`),
  * it lets this library choose a web map link to show, but only if no other data is shown.
  * To disable the functionality set this to `false`.
+ * @property {import("ol/layer/WebGLTile.js").Style|null} [style=null] The style for GeoTIFF and GeoZarr layers (WebGLTileLayer style).
  * @property {Style} [boundsStyle] The style for the overall bounds / footprint.
  * @property {Style} [collectionStyle] The style for individual children in a list of STAC Items or Collections.
  * @property {null|string} [crossOrigin] For thumbnails: The `crossOrigin` attribute for loaded images / tiles.
@@ -167,7 +176,7 @@ class STACLayer extends LayerGroup {
          */
         this.assets_ = null;
         /**
-         * @type {Array<number>}
+         * @type {Array<number|string>}
          * @private
          */
         this.bands_ = [];
@@ -210,6 +219,11 @@ class STACLayer extends LayerGroup {
          * @private
          */
         this.useTileLayerAsFallback_ = options.useTileLayerAsFallback || false;
+        /**
+         * @type {import("ol/layer/WebGLTile.js").Style|null}
+         * @private
+         */
+        this.style_ = options.style || null;
         /**
          * @type {Style}
          * @private
@@ -296,12 +310,11 @@ class STACLayer extends LayerGroup {
      * @api
      */
     isEmpty() {
-        var _a;
         const count = this.getLayers().getLength();
         if (count > 1) {
             return false;
         }
-        const bbox = (_a = this.getData()) === null || _a === void 0 ? void 0 : _a.getBoundingBox();
+        const bbox = this.getData().getBoundingBox();
         if (!bbox || isEmpty(bbox)) {
             return true;
         }
@@ -312,6 +325,11 @@ class STACLayer extends LayerGroup {
      * @private
      */
     handleError_(error) {
+        const listeners = this.getListeners('error');
+        if (!Array.isArray(listeners) || listeners.length === 0) {
+            // To avoid swallowing errors when no listener is registered, log them to the console.
+            console.error(error); // eslint-disable-line no-console
+        }
         /**
          * Error event.
          *
@@ -326,12 +344,12 @@ class STACLayer extends LayerGroup {
      * @param {string} url The url to the data.
      * @param {APICollection|Object|Array<STAC>|string|null} children The child STAC entities to show.
      * @param {Array<Asset|string>|null} assets The assets to show.
-     * @param {Array<number>} bands The (one-based) bands to show.
+     * @param {Array<number|string>} bands The bands to show.
      * @private
      */
     configure_(data, url = null, children = null, assets = null, bands = []) {
         let stac;
-        if (data instanceof Asset || data instanceof STAC) {
+        if (data.isAsset || data.isSTAC) {
             stac = data;
         }
         else {
@@ -633,8 +651,7 @@ class STACLayer extends LayerGroup {
         }
         const sourceInfo = getGeoTiffSourceInfoFromAsset(asset, this.bands_);
         /**
-         * todo: temporary fix for https://github.com/openlayers/openlayers/issues/17153
-         * @type {import("../source/GeoTIFF.js").Options}
+         * @type {import("ol/source/GeoTIFF.js").Options}
          */
         let options = {
             sources: [sourceInfo],
@@ -645,7 +662,7 @@ class STACLayer extends LayerGroup {
         if (projection) {
             options.projection = projection;
         }
-        const classificationStyle = getClassificationStyle(asset, this.bands_);
+        const classificationStyle = getClassificationStyle(asset, sourceInfo.bands);
         if (classificationStyle) {
             options.normalize = false;
         }
@@ -669,7 +686,10 @@ class STACLayer extends LayerGroup {
         try {
             await status;
             const layerOptions = { source };
-            if (classificationStyle) {
+            if (this.style_) {
+                layerOptions.style = this.style_;
+            }
+            else if (classificationStyle) {
                 layerOptions.style = classificationStyle;
             }
             const layer = new WebGLTileLayer(layerOptions);
@@ -711,7 +731,7 @@ class STACLayer extends LayerGroup {
     }
     /**
      * @param {Layer|LayerGroup} [layer] A Layer to add to the LayerGroup
-     * @param {import("stac-js").STACObject} [data] The STAC object, can be any class exposed by stac-js
+     * @param {STACObject} [data] The STAC object, can be any class exposed by stac-js
      * @param {number} [zIndex] The z-index for the layer
      * @private
      */
@@ -729,7 +749,7 @@ class STACLayer extends LayerGroup {
     addFootprint_() {
         let geojson = null;
         const data = this.getData();
-        if (data.isItemCollection || data.isCollectionCollection) {
+        if (data.isApiCollection) {
             geojson = toGeoJSON(data.getBoundingBox());
         }
         else {
@@ -794,7 +814,7 @@ class STACLayer extends LayerGroup {
      */
     async addLabelExtension_() {
         const data = this.getData();
-        if (!(data instanceof Item)) {
+        if (!data || !data.isItem) {
             return;
         }
         // determine the asset with the geojson labels
@@ -828,7 +848,7 @@ class STACLayer extends LayerGroup {
                     return null;
                 }
             });
-            const items = (await Promise.all(promises)).filter((item) => item instanceof STAC);
+            const items = (await Promise.all(promises)).filter((item) => item && item.isSTAC);
             await this.addChildren_(items, { displayFootprint: false });
         }
         // Add the GeoJSON labels
@@ -839,6 +859,43 @@ class STACLayer extends LayerGroup {
             this.handleError_(error);
         }
     }
+    async addGeoZarr_(asset) {
+        if (this.buildTileUrlTemplate_ && !this.useTileLayerAsFallback_) {
+            return await this.addTileLayerForImagery_(asset);
+        }
+        let options = getGeoZarrSourceOptionsFromAsset(asset, this.bands_);
+        if (this.getSourceOptions_) {
+            // @ts-ignore
+            options = await this.getSourceOptions_(SourceType.GeoZarr, options, asset);
+        }
+        try {
+            const GeoZarr = (await import('ol/source/GeoZarr.js')).default;
+            const source = new GeoZarr(options);
+            await new Promise((resolve, reject) => {
+                source.on('change', () => {
+                    if (source.getState() === 'error') {
+                        reject(source.error_);
+                    }
+                    else {
+                        resolve();
+                    }
+                });
+            });
+            const layerOptions = { source };
+            if (this.style_) {
+                layerOptions.style = this.style_;
+            }
+            const layer = new WebGLTileLayer(layerOptions);
+            this.addLayer_(layer, asset);
+            return layer;
+        }
+        catch (error) {
+            if (this.useTileLayerAsFallback_) {
+                return await this.addTileLayerForImagery_(asset);
+            }
+            this.handleError_(error);
+        }
+    }
     /**
      * Update the layers shown manually based on the current configuration.
      * Usually this doesn't need to be called manually.
@@ -873,12 +930,15 @@ class STACLayer extends LayerGroup {
                 if (!ref) {
                     return;
                 }
-                if (ref.type === geojsonMediaType) {
+                if (ref.isType(geojsonMediaType)) {
                     return await this.addGeoJson_(ref);
                 }
-                if (ref.isGeoTIFF) {
+                if (ref.isType(geotiffMediaTypes)) {
                     return await this.addGeoTiff_(ref);
                 }
+                if (ref.isType(wozMediaTypes)) {
+                    return await this.addGeoZarr_(ref);
+                }
                 if (ref.canBrowserDisplayImage()) {
                     return await this.addPreviewImage_(ref);
                 }
@@ -889,10 +949,10 @@ class STACLayer extends LayerGroup {
         // choose a sensible default visualization
         if (this.hasOnlyBounds()) {
             // Show the ItemCollection/CollectionCollection entries
-            if (data instanceof APICollection) {
+            if (data.isApiCollection) {
                 await this.addChildren_(data.getAll(), this.childrenOptions_);
             }
-            else if (data instanceof STAC) {
+            else if (data.isSTAC) {
                 // Show label extension
                 if (data.isItem &&
                     data.supportsExtension(LABEL_EXTENSION) &&
@@ -903,27 +963,32 @@ class STACLayer extends LayerGroup {
                     }
                     return;
                 }
-                // Show web map links
-                const links = this.getWebMapLinks();
-                if (links.length > 0) {
-                    await this.addLayerForLink(links[0]);
-                }
-                else {
-                    // Find an asset that we can visualize
-                    const geotiff = data.getDefaultGeoTIFF(true, !this.displayGeoTiffByDefault_);
-                    let layer;
-                    // Try to visualize the default GeoTIFF first
-                    if (geotiff && this.displayOverview_) {
+                let layer;
+                if (this.displayOverview_ && !layer) {
+                    // Find a GeoTiff asset that we can visualize
+                    const geotiff = data.getDefaultGeoFile('geotiff', true, !this.displayGeoTiffByDefault_);
+                    if (geotiff) {
                         layer = await this.addGeoTiff_(geotiff);
                     }
-                    // If no GeoTIFF is available or it can't be shown (e.g. error),
-                    // try to visualize the default thumbnail
-                    if (this.displayPreview_ && (!geotiff || !layer)) {
-                        // This may return Links or Assets
-                        const thumbnails = data.getThumbnails(true, 'overview');
-                        if (thumbnails.length > 0) {
-                            await this.addPreviewImage_(thumbnails[0]);
-                        }
+                }
+                if (this.displayOverview_ && !layer) {
+                    // Find a Web-Optimized GeoZarr asset that we can visualize
+                    const geozarr = data.getDefaultGeoFile('geozarr', true, true);
+                    if (geozarr) {
+                        layer = await this.addGeoZarr_(geozarr);
+                    }
+                }
+                // Show web map links if available
+                const links = this.getWebMapLinks();
+                if (!layer && links.length > 0) {
+                    layer = await this.addLayerForLink(links[0]);
+                }
+                // If no other layer is available, try to visualize the default thumbnail
+                if (this.displayPreview_ && !layer) {
+                    // This may return Links or Assets
+                    const thumbnails = data.getThumbnails(true, 'overview');
+                    if (thumbnails.length > 0) {
+                        await this.addPreviewImage_(thumbnails[0]);
                     }
                 }
             }
@@ -948,8 +1013,11 @@ class STACLayer extends LayerGroup {
      * @api
      */
     getWebMapLinks() {
+        if (this.displayWebMapLink_ === false) {
+            return [];
+        }
         const data = this.getData();
-        if (data instanceof Asset) {
+        if (!data || data.isAsset) {
             return [];
         }
         let types = ['xyz', 'tilejson', 'pmtiles', 'wmts', 'wms']; // This also defines the priority
@@ -980,6 +1048,19 @@ class STACLayer extends LayerGroup {
         }
         return mapLinks;
     }
+    /**
+     * Set the style for GeoTIFF and GeoZarr layers (WebGLTileLayer style).
+     * @param {import("ol/layer/WebGLTile.js").Style|null} style The style to apply.
+     * @api
+     */
+    setStyle(style) {
+        this.style_ = style || null;
+        for (const layer of this.getLayersArray()) {
+            if (layer instanceof WebGLTileLayer) {
+                layer.setStyle(this.style_);
+            }
+        }
+    }
     /**
      * Update the assets to be rendered.
      * @param {Array<string|Asset>|null} assets The assets to show.
@@ -994,10 +1075,11 @@ class STACLayer extends LayerGroup {
         if (Array.isArray(assets)) {
             const data = this.getData();
             this.assets_ = assets.map((asset) => {
-                if (data instanceof STAC && typeof asset === 'string') {
+                const isStr = typeof asset === 'string';
+                if (data.isSTAC && isStr) {
                     return data.getAsset(asset);
                 }
-                if (!(asset instanceof Asset)) {
+                if (!isStr && !asset.isAsset) {
                     return new Asset(asset);
                 }
                 return asset;
@@ -1022,18 +1104,19 @@ class STACLayer extends LayerGroup {
      * @api
      */
     async setChildren(childs, options = null, updateLayers = true) {
-        if (childs instanceof ItemCollection) {
+        const childsIsObj = isObject(childs);
+        if (childsIsObj && childs.isItemCollection) {
             this.children_ = childs.getAll();
         }
-        else if (childs instanceof CollectionCollection) {
+        else if (childsIsObj && childs.isCollectionCollection) {
             this.children_ = childs.getAll();
         }
-        else if (isObject(childs) && childs.type === 'FeatureCollection') {
+        else if (childsIsObj && childs.type === 'FeatureCollection') {
             this.children_ = create(childs, !this.disableMigration_).getAll();
         }
         else if (Array.isArray(childs)) {
             this.children_ = childs.map((child) => {
-                if (child instanceof STAC) {
+                if (child.isSTAC) {
                     return child;
                 }
                 return create(child, !this.disableMigration_);