ol-stac - npm Package Compare versions

Comparing version 1.0.0-rc.3 to 1.0.0-rc.4

layer/STAC.d.ts

@@ -21,5 +21,5 @@ export default STACLayer;
      * For STAC Catalogs and Collections, any child entites
-     * to show. Can be STAC ItemCollections (as ItemCollection, GeoJSON FeatureCollection, or URL) or a list of STAC entities.
+     * to show. Can be STAC ItemCollections (as ItemCollection or GeoJSON FeatureCollection) or a list of STAC entities.
      */
-    children?: ItemCollection | any | Array<STAC> | string | null;
+    children?: ItemCollection | any | Array<STAC | any> | null;
     /**
@@ -96,3 +96,3 @@ * The the given children, apply the given options.
      */
-    buildTileUrlTemplate?: ((arg0: Asset) => string | null) | undefined;
+    buildTileUrlTemplate?: ((arg0: (Asset | Link)) => string | null) | undefined;
     /**
@@ -153,2 +153,8 @@ * Uses the given URL template only when the client-side GeoTIFF rendering fails.
     disableMigration?: boolean | undefined;
+    /**
+     * Sets a custom function to make HTTP requests with.
+     * The first parameter is the URL to request and the output is a promise that resolves with the response body.
+     * The second parameter is the return type, either `json` (default) or `text`.
+     */
+    httpRequestFn?: ((arg0: string, arg1: string) => (any)) | undefined;
 };
@@ -179,4 +185,4 @@ /**
  * `data` take precedence over `url`.
- * @property {ItemCollection|Object|Array<STAC>|string|null} [children=null] For STAC Catalogs and Collections, any child entites
- * to show. Can be STAC ItemCollections (as ItemCollection, GeoJSON FeatureCollection, or URL) or a list of STAC entities.
+ * @property {ItemCollection|Object|Array<STAC|Object>|null} [children=null] For STAC Catalogs and Collections, any child entites
+ * to show. Can be STAC ItemCollections (as ItemCollection or GeoJSON FeatureCollection) or a list of STAC entities.
  * @property {Options} [childrenOptions={}] The the given children, apply the given options.
@@ -214,3 +220,3 @@ * @property {Array<string|Asset>|null} [assets=null] The selector for the assets to be rendered,
  * See https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image for more detail.
- * @property {function(Asset):string|null} [buildTileUrlTemplate=null] A function that generates a URL template for a tile server (XYZ),
+ * @property {function((Asset|Link)):string|null} [buildTileUrlTemplate=null] A function that generates a URL template for a tile server (XYZ),
  * which will be used instead of the client-side GeoTIFF rendering (except if `useTileLayerAsFallback` is `true`).
@@ -237,2 +243,5 @@ * @property {boolean} [useTileLayerAsFallback=false] Uses the given URL template only when the client-side GeoTIFF rendering fails.
  * Only enable this if you are sure that the STAC object is already in the latest version.
+ * @property {function(string,string):(*)} [httpRequestFn=null] Sets a custom function to make HTTP requests with.
+ * The first parameter is the URL to request and the output is a promise that resolves with the response body.
+ * The second parameter is the return type, either `json` (default) or `text`.
  */
@@ -311,3 +320,3 @@ /**
     /**
-     * @type {function(Asset):string|null}
+     * @type {function((Asset|Link)):string|null}
      * @private
@@ -352,2 +361,10 @@ */
     /**
+     * Default function make HTTP requests with.
+     *
+     * @param {string} url The URL to request and the output is a promise that resolves with the response body.
+     * @param {string} responseType The return type, either `json` (default) or `text`.
+     * @return {Promise<*>} The (parsed) response body.
+     */
+    fetch_(url: string, responseType?: string): Promise<any>;
+    /**
      * Returns the vector layer that visualizes the bounds / footprint.
@@ -467,4 +484,11 @@ * @return {VectorLayer|null} The vector layer for the bounds
     /**
+     * Adds GeoJSON labels and GeoTIFF source imagery to the map based on the label extension.
+     *
+     * @return {Promise<Layer|undefined>} The layer added to the map.
      * @private
      */
+    private addLabelExtension_;
+    /**
+     * @private
+     */
     private updateLayers_;
@@ -492,3 +516,6 @@ /**
      * Updates the children STAC entities to be rendered.
-     * @param {ItemCollection|Object|Array<STAC>|string|null} childs The children to show.
+     *
+     * If an object is passed, it must be a GeoJSON FeatureCollection.
+     *
+     * @param {ItemCollection|Object|Array<STAC|Object>|null} childs The children to show.
      * @param {Options} [options] STACLayer options for the children. Only applies if `children` are given.
@@ -498,3 +525,3 @@ * @return {Promise} Resolves when all items are rendered.
      */
-    setChildren(childs: ItemCollection | any | Array<STAC> | string | null, options?: Options | undefined): Promise<any>;
+    setChildren(childs: ItemCollection | any | Array<STAC | any> | null, options?: Options | undefined): Promise<any>;
     /**
@@ -510,6 +537,6 @@ * Get the STAC object.
      *
-     * @return {STAC} The STAC child entities.
+     * @return {Array<STAC>} The STAC child entities.
      * @api
      */
-    getChildren(): STAC;
+    getChildren(): Array<STAC>;
     /**
@@ -534,2 +561,9 @@ * Get the STAC assets shown.
     getSource(): SourceType | null;
+    /**
+     * Gets the WMTS capabilities from the given web-map-links URL.
+     * @param {string} url Base URL for the WMTS
+     * @return {Promise<Object|null>} Resolves with the WMTS Capabilities object
+     * @private
+     */
+    private getWmtsCapabilities_;
 }
@@ -536,0 +570,0 @@ import SourceType from '../source/type.js';

layer/STAC.js

@@ -25,6 +25,8 @@ /**
 import { transformExtent } from 'ol/proj.js';
-import create, { Asset, ItemCollection, STAC } from 'stac-js';
-import { defaultBoundsStyle, defaultCollectionStyle, getBoundsStyle, getGeoTiffSourceInfoFromAsset, getProjection, getSpecificWebMapUrl, getWmtsCapabilities, } from '../util.js';
+import create, { APICollection, Asset, Item, ItemCollection, STAC, } from 'stac-js';
+import { LABEL_EXTENSION, defaultBoundsStyle, defaultCollectionStyle, getBoundsStyle, getGeoTiffSourceInfoFromAsset, getProjection, getSpecificWebMapUrl, } from '../util.js';
+import { WMTSCapabilities } from 'ol/format.js';
+import { fixGeoJson, toGeoJSON } from 'stac-js/src/geo.js';
 import { geojsonMediaType } from 'stac-js/src/mediatypes.js';
-import { toGeoJSON } from 'stac-js/src/geo.js';
+import { isObject } from 'stac-js/src/utils.js';
 /**
@@ -54,4 +56,4 @@ * @typedef {import("ol/extent.js").Extent} Extent
  * `data` take precedence over `url`.
- * @property {ItemCollection|Object|Array<STAC>|string|null} [children=null] For STAC Catalogs and Collections, any child entites
- * to show. Can be STAC ItemCollections (as ItemCollection, GeoJSON FeatureCollection, or URL) or a list of STAC entities.
+ * @property {ItemCollection|Object|Array<STAC|Object>|null} [children=null] For STAC Catalogs and Collections, any child entites
+ * to show. Can be STAC ItemCollections (as ItemCollection or GeoJSON FeatureCollection) or a list of STAC entities.
  * @property {Options} [childrenOptions={}] The the given children, apply the given options.
@@ -89,3 +91,3 @@ * @property {Array<string|Asset>|null} [assets=null] The selector for the assets to be rendered,
  * See https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image for more detail.
- * @property {function(Asset):string|null} [buildTileUrlTemplate=null] A function that generates a URL template for a tile server (XYZ),
+ * @property {function((Asset|Link)):string|null} [buildTileUrlTemplate=null] A function that generates a URL template for a tile server (XYZ),
  * which will be used instead of the client-side GeoTIFF rendering (except if `useTileLayerAsFallback` is `true`).
@@ -112,2 +114,5 @@ * @property {boolean} [useTileLayerAsFallback=false] Uses the given URL template only when the client-side GeoTIFF rendering fails.
  * Only enable this if you are sure that the STAC object is already in the latest version.
+ * @property {function(string,string):(*)} [httpRequestFn=null] Sets a custom function to make HTTP requests with.
+ * The first parameter is the URL to request and the output is a promise that resolves with the response body.
+ * The second parameter is the return type, either `json` (default) or `text`.
  */
@@ -198,3 +203,3 @@ /**
         /**
-         * @type {function(Asset):string|null}
+         * @type {function((Asset|Link)):string|null}
          * @private
@@ -238,2 +243,5 @@ */
         this.eventQueue_ = [];
+        if (options.httpRequestFn) {
+            this.fetch_ = options.httpRequestFn;
+        }
         if (options.data) {
@@ -251,4 +259,3 @@ try {
         }
-        fetch(options.url)
-            .then((response) => response.json())
+        this.fetch_(options.url)
             .then((data) => this.configure_(data, options.url, options.children, options.assets, options.bands))
@@ -258,2 +265,22 @@ .catch((error) => this.handleError_(error));
     /**
+     * Default function make HTTP requests with.
+     *
+     * @param {string} url The URL to request and the output is a promise that resolves with the response body.
+     * @param {string} responseType The return type, either `json` (default) or `text`.
+     * @return {Promise<*>} The (parsed) response body.
+     */
+    async fetch_(url, responseType = 'json') {
+        const response = await fetch(url);
+        if (!response.ok) {
+            throw new Error(`Unexpected response from ${url}: ${response.status}`);
+        }
+        if (responseType === 'json') {
+            return await response.json();
+        }
+        if (responseType === 'text') {
+            return await response.text();
+        }
+        return null;
+    }
+    /**
      * Returns the vector layer that visualizes the bounds / footprint.
@@ -315,3 +342,3 @@ * @return {VectorLayer|null} The vector layer for the bounds
         }
-        if (url && url.includes('://')) {
+        if (url && url.includes('://') && stac instanceof STAC) {
             stac.setAbsoluteUrl(url);
@@ -329,4 +356,5 @@ }
         this.getLayers().on('remove', updateBoundsStyle);
-        const wait1 = this.setChildren(children).catch(this.handleError_);
-        const wait2 = this.setAssets(assets).catch(this.handleError_);
+        const errorHandler = (error) => this.handleError_(error);
+        const wait1 = this.setChildren(children).catch(errorHandler);
+        const wait2 = this.setAssets(assets).catch(errorHandler);
         Promise.all([wait1, wait2]).then(() => {
@@ -517,3 +545,3 @@ /**
             case 'wmts':
-                const wmtsCapabilities = await getWmtsCapabilities(url);
+                const wmtsCapabilities = await this.getWmtsCapabilities_(url);
                 if (!wmtsCapabilities) {
@@ -673,4 +701,3 @@ return;
         try {
-            const response = await fetch(asset.getAbsoluteUrl());
-            const geojson = await response.json();
+            const geojson = await this.fetch_(asset.getAbsoluteUrl());
             const layer = this.createGeoJsonLayer_(geojson);
@@ -698,2 +725,3 @@ this.addLayer_(layer, asset);
             loader: (extent, resolution, projection) => {
+                geojson = fixGeoJson(geojson);
                 const features = format.readFeatures(geojson, {
@@ -711,4 +739,57 @@ featureProjection: projection,
     /**
+     * Adds GeoJSON labels and GeoTIFF source imagery to the map based on the label extension.
+     *
+     * @return {Promise<Layer|undefined>} The layer added to the map.
      * @private
      */
+    async addLabelExtension_() {
+        const data = this.getData();
+        if (!(data instanceof Item)) {
+            return;
+        }
+        // determine the asset with the geojson labels
+        let assets = data.getAssetsWithRoles(['labels', 'labels-vector'], true);
+        let labelAsset;
+        if (assets.length > 1) {
+            labelAsset = assets.find((asset) => asset.roles.includes('labels-vector'));
+        }
+        if (!labelAsset) {
+            labelAsset = data.getAsset('vector_labels');
+        }
+        if (!labelAsset) {
+            assets = data
+                .getAssets()
+                .filter((asset) => asset.type === geojsonMediaType && !asset.roles);
+            if (assets.length === 1) {
+                labelAsset = assets[0];
+            }
+        }
+        // Add the source imagery
+        const sourceLinks = data.getLinksWithRels(['source']);
+        if (labelAsset && sourceLinks.length > 0) {
+            const promises = sourceLinks.map(async (link) => {
+                try {
+                    const response = await this.fetch_(link.getAbsoluteUrl());
+                    const stac = create(response);
+                    return stac;
+                }
+                catch (error) {
+                    this.handleError_(error);
+                    return null;
+                }
+            });
+            const items = (await Promise.all(promises)).filter((item) => item instanceof STAC);
+            await this.addChildren_(items, { displayFootprint: false });
+        }
+        // Add the GeoJSON labels
+        try {
+            await this.addGeoJson_(labelAsset);
+        }
+        catch (error) {
+            this.handleError_(error);
+        }
+    }
+    /**
+     * @private
+     */
     async updateLayers_() {
@@ -757,6 +838,13 @@ // Remove old layers
             // Show the ItemCollection/CollectionCollection entries
-            if (data.isItemCollection() || data.isCollectionCollection()) {
-                await this.addChildren_(this.getData().getAll(), this.childrenOptions_);
+            if (data instanceof APICollection) {
+                await this.addChildren_(data.getAll(), this.childrenOptions_);
             }
-            else {
+            else if (data instanceof STAC) {
+                // Show label extension
+                if (data.isItem() &&
+                    data.supportsExtension(LABEL_EXTENSION) &&
+                    data.getMetadata('label:type') === 'vector') {
+                    await this.addLabelExtension_();
+                    return;
+                }
                 // Show web map links
@@ -769,3 +857,3 @@ const links = this.getWebMapLinks();
                     // Find an asset that we can visualize
-                    const geotiff = this.getData().getDefaultGeoTIFF(true, !this.displayGeoTiffByDefault_);
+                    const geotiff = data.getDefaultGeoTIFF(true, !this.displayGeoTiffByDefault_);
                     let layer;
@@ -780,3 +868,3 @@ // Try to visualize the default GeoTIFF first
                         // This may return Links or Assets
-                        const thumbnails = this.getData().getThumbnails(true, 'overview');
+                        const thumbnails = data.getThumbnails(true, 'overview');
                         if (thumbnails.length > 0) {
@@ -806,2 +894,6 @@ await this.addPreviewImage_(thumbnails[0]);
     getWebMapLinks() {
+        const data = this.getData();
+        if (data instanceof Asset) {
+            return [];
+        }
         let types = ['xyz', 'tilejson', 'pmtiles', 'wmts', 'wms']; // This also defines the priority
@@ -811,3 +903,3 @@ if (typeof this.displayWebMapLink_ === 'string') {
         }
-        let mapLinks = this.getData().getLinksWithRels(types);
+        let mapLinks = data.getLinksWithRels(types);
         if (Array.isArray(this.displayWebMapLink_)) {
@@ -844,5 +936,6 @@ mapLinks = this.displayWebMapLink_
         if (Array.isArray(assets)) {
+            const data = this.getData();
             this.assets_ = assets.map((asset) => {
-                if (typeof asset === 'string') {
-                    return this.getData().getAsset(asset);
+                if (data instanceof STAC && typeof asset === 'string') {
+                    return data.getAsset(asset);
                 }
@@ -862,3 +955,6 @@ if (!(asset instanceof Asset)) {
      * Updates the children STAC entities to be rendered.
-     * @param {ItemCollection|Object|Array<STAC>|string|null} childs The children to show.
+     *
+     * If an object is passed, it must be a GeoJSON FeatureCollection.
+     *
+     * @param {ItemCollection|Object|Array<STAC|Object>|null} childs The children to show.
      * @param {Options} [options] STACLayer options for the children. Only applies if `children` are given.
@@ -874,12 +970,8 @@ * @return {Promise} Resolves when all items are rendered.
         }
-        if (typeof childs === 'string') {
-            const response = await fetch(childs);
-            childs = await response.json();
-        }
-        if (typeof childs === 'object' && childs.type === 'FeatureCollection') {
-            childs = childs.features;
-        }
         if (childs instanceof ItemCollection) {
             this.children_ = childs.getAll();
         }
+        else if (isObject(childs) && childs.type === 'FeatureCollection') {
+            childs = create(childs).getAll();
+        }
         else if (Array.isArray(childs)) {
@@ -915,3 +1007,3 @@ childs = childs.map((child) => {
      *
-     * @return {STAC} The STAC child entities.
+     * @return {Array<STAC>} The STAC child entities.
      * @api
@@ -981,4 +1073,22 @@ */
     }
+    /**
+     * Gets the WMTS capabilities from the given web-map-links URL.
+     * @param {string} url Base URL for the WMTS
+     * @return {Promise<Object|null>} Resolves with the WMTS Capabilities object
+     * @private
+     */
+    async getWmtsCapabilities_(url) {
+        try {
+            const urlObj = new URL(url);
+            urlObj.searchParams.set('service', 'wmts');
+            urlObj.searchParams.set('request', 'GetCapabilities');
+            const response = await this.fetch_(urlObj.toString(), 'text');
+            return new WMTSCapabilities().read(response);
+        }
+        catch (error) {
+            return null;
+        }
+    }
 }
 export default STACLayer;
 //# sourceMappingURL=STAC.js.map

package.json

 {
   "name": "ol-stac",
-  "version": "1.0.0-rc.3",
+  "version": "1.0.0-rc.4",
   "description": "An \"automagical\" STAC LayerGroup for OpenLayers",
@@ -22,3 +22,3 @@ "homepage": "https://mohr.ws",
     "ol-pmtiles": "~0.2.0",
-    "stac-js": "~0.1.2"
+    "stac-js": "~0.1.4"
   },
@@ -25,0 +25,0 @@ "peerDependencies": {

util.d.ts

@@ -40,9 +40,4 @@ /**
 export function getSpecificWebMapUrl(link: any): string | null;
+export const LABEL_EXTENSION: "https://stac-extensions.github.io/label/v1.*/schema.json";
 /**
- * Gets the WMTS capabilities from the given web-map-links URL.
- * @param {string} url Base URL for the WMTS
- * @return {Promise<Object|null>} Resolves with the WMTS Capabilities object
- */
-export function getWmtsCapabilities(url: string): Promise<any | null>;
-/**
  * The default style for rendering bounds of the STAC main entities.
@@ -49,0 +44,0 @@ * @type {Style}

util.js

@@ -7,4 +7,4 @@ /**
 import { STAC } from 'stac-js';
-import { WMTSCapabilities } from 'ol/format.js';
 import { fromEPSGCode, isRegistered as isProj4Registered, } from 'ol/proj/proj4.js';
+export const LABEL_EXTENSION = 'https://stac-extensions.github.io/label/v1.*/schema.json';
 /**
@@ -160,19 +160,2 @@ * The default style for rendering bounds of the STAC main entities.
 }
-/**
- * Gets the WMTS capabilities from the given web-map-links URL.
- * @param {string} url Base URL for the WMTS
- * @return {Promise<Object|null>} Resolves with the WMTS Capabilities object
- */
-export async function getWmtsCapabilities(url) {
-    try {
-        const urlObj = new URL(url);
-        urlObj.searchParams.set('service', 'wmts');
-        urlObj.searchParams.set('request', 'GetCapabilities');
-        const response = await fetch(urlObj);
-        return new WMTSCapabilities().read(await response.text());
-    }
-    catch (error) {
-        return null;
-    }
-}
 //# sourceMappingURL=util.js.map

No alert changes

Improved metrics

Total package byte prevSize

124093

increased by6.69%

Lines of code

2095

increased by6.18%

Number of medium supply chain risk alerts

1

decreased by-75%

Dependency changes

• Updatedstac-js@~0.1.4