Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
ol-mapbox-style
Advanced tools
ol-mapbox-style - npm Package Compare versions
Comparing version 10.3.3 to 10.3.4
@@ -5,5 +5,9 @@ # Changelog | ||
| ## 10.3.4 | ||
| * Fix addMapboxLayer - updateMapboxLayer - removeMapboxLayer sequence | ||
| ## 10.3.3 | ||
| * Fix `updateMapboxLayers()` and function/filter cache handling | ||
| * Fix `updateMapboxLayer()` and function/filter cache handling | ||
@@ -10,0 +14,0 @@ ## 10.3.2 |
@@ -126,85 +126,3 @@ /** | ||
| export function apply(mapOrGroupOrElement: Map | HTMLElement | string | LayerGroup, style: string | any, options?: Options): Promise<Map | LayerGroup>; | ||
| /** | ||
| * Get the OpenLayers layer instance that contains the provided Mapbox Style | ||
| * `layer`. Note that multiple Mapbox Style layers are combined in a single | ||
| * OpenLayers layer instance when they use the same Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Style layer id. | ||
| * @return {Layer} OpenLayers layer instance. | ||
| */ | ||
| export function getLayer(map: Map | LayerGroup, layerId: string): Layer; | ||
| /** | ||
| * Get the OpenLayers layer instances for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Array<Layer>} OpenLayers layer instances. | ||
| */ | ||
| export function getLayers(map: Map | LayerGroup, sourceId: string): Array<Layer>; | ||
| /** | ||
| * Get the OpenLayers source instance for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Source} OpenLayers source instance. | ||
| */ | ||
| export function getSource(map: Map | LayerGroup, sourceId: string): Source; | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * | ||
| * The feature state will be stored on the OpenLayers layer matching the feature identifier, in the | ||
| * `mapbox-featurestate` property. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer OpenLayers Map or layer to set the feature | ||
| * state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @param {Object|null} state Feature state. Set to `null` to remove the feature state. | ||
| */ | ||
| export function setFeatureState(mapOrLayer: Map | VectorLayer<any> | VectorTileLayer, feature: FeatureIdentifier, state: any | null): void; | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer Map or layer to set the feature state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @return {Object|null} Feature state or `null` when no feature state is set for the given | ||
| * feature identifier. | ||
| */ | ||
| export function getFeatureState(mapOrLayer: Map | VectorLayer<any> | VectorTileLayer, feature: FeatureIdentifier): any | null; | ||
| /** | ||
| * Get the Mapbox Layer object for the provided `layerId`. | ||
| * @param {Map|LayerGroup} mapOrGroup Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Layer id. | ||
| * @return {Object} Mapbox Layer object. | ||
| */ | ||
| export function getMapboxLayer(mapOrGroup: Map | LayerGroup, layerId: string): any; | ||
| /** | ||
| * Add a new Mapbox Layer object to the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Mapbox Layer object. | ||
| * @param {string} [beforeLayerId] Optional id of the Mapbox Layer before the new layer that will be added. | ||
| */ | ||
| export function addMapboxLayer(mapOrGroup: Map | LayerGroup, mapboxLayer: any, beforeLayerId?: string | undefined): void; | ||
| /** | ||
| * Update a Mapbox Layer object in the style. The map will be re-rendered with the new style. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Updated Mapbox Layer object. | ||
| */ | ||
| export function updateMapboxLayer(mapOrGroup: Map | LayerGroup, mapboxLayer: any): void; | ||
| /** | ||
| * Remove a Mapbox Layer object from the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {string|Object} mapboxLayerIdOrLayer Mapbox Layer id or Mapbox Layer object. | ||
| */ | ||
| export function removeMapboxLayer(mapOrGroup: Map | LayerGroup, mapboxLayerIdOrLayer: string | any): void; | ||
| export { finalizeLayer as _finalizeLayer }; | ||
| export type FeatureIdentifier = { | ||
| /** | ||
| * The feature id. | ||
| */ | ||
| id: string | number; | ||
| /** | ||
| * The source id. | ||
| */ | ||
| source: string; | ||
| }; | ||
| export type Options = { | ||
@@ -275,4 +193,2 @@ /** | ||
| import LayerGroup from "ol/layer/Group.js"; | ||
| import Layer from "ol/layer/Layer.js"; | ||
| import Source from "ol/source/Source.js"; | ||
| /** | ||
@@ -297,1 +213,2 @@ * If layerIds is not empty, applies the style specified in glStyle to the layer, | ||
| declare function finalizeLayer(layer: Layer, layerIds: Array<string>, glStyle: any, styleUrl: string | undefined, mapOrGroup: Map | LayerGroup, options?: Options): Promise<any>; | ||
| import Layer from "ol/layer/Layer.js"; |
| export { stylefunction, recordStyleLayer, renderTransparent } from "./stylefunction.js"; | ||
| export { apply as default, apply, applyBackground, applyStyle, getFeatureState, setFeatureState, getLayer, getLayers, getSource, getMapboxLayer, updateMapboxLayer, addMapboxLayer, removeMapboxLayer } from "./apply.js"; | ||
| export { apply as default, apply, applyBackground, applyStyle } from "./apply.js"; | ||
| export { getFeatureState, setFeatureState, getLayer, getLayers, getSource, getMapboxLayer, updateMapboxLayer, addMapboxLayer, removeMapboxLayer } from "./util.js"; |
@@ -96,3 +96,4 @@ /** | ||
| */ | ||
| export function stylefunction(olLayer: import("ol/layer/Vector").default<any> | VectorTileLayer, glStyle: string | any, sourceOrLayers: string | Array<string>, resolutions?: Array<number>, spriteData?: any, spriteImageUrl?: string, getFonts?: (arg0: Array<string>) => Array<string>, getImage?: ((arg0: import("ol/layer/Vector").default<any> | VectorTileLayer, arg1: string) => HTMLImageElement | HTMLCanvasElement | string | undefined) | undefined): StyleFunction; | ||
| export function stylefunction(olLayer: import("ol/layer/Vector").default<any> | VectorTileLayer, glStyle: string | any, sourceOrLayers: string | Array<string>, resolutions?: Array<number>, spriteData?: any, spriteImageUrl?: string, getFonts?: (arg0: Array<string>) => Array<string>, getImage?: ((arg0: import("ol/layer/Vector").default<any> | VectorTileLayer, arg1: string) => HTMLImageElement | HTMLCanvasElement | string | undefined) | undefined, ...args: any[]): StyleFunction; | ||
| export const styleFunctionArgs: {}; | ||
| export type VectorLayer = import("ol/layer/Vector").default<any>; | ||
@@ -99,0 +100,0 @@ export type VectorTileLayer = import("ol/layer/VectorTile").default; |
@@ -0,1 +1,3 @@ | ||
| export function getStyleId(glStyle: any): any; | ||
| export function getStyleFunctionKey(glStyle: any, olLayer: any): string; | ||
| /** | ||
@@ -59,4 +61,92 @@ * @param {Object} glStyle Mapboox style object. | ||
| }): HTMLCanvasElement; | ||
| /** | ||
| * Get the OpenLayers layer instance that contains the provided Mapbox Style | ||
| * `layer`. Note that multiple Mapbox Style layers are combined in a single | ||
| * OpenLayers layer instance when they use the same Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Style layer id. | ||
| * @return {Layer} OpenLayers layer instance. | ||
| */ | ||
| export function getLayer(map: Map | LayerGroup, layerId: string): Layer; | ||
| /** | ||
| * Get the OpenLayers layer instances for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Array<Layer>} OpenLayers layer instances. | ||
| */ | ||
| export function getLayers(map: Map | LayerGroup, sourceId: string): Array<Layer>; | ||
| /** | ||
| * Get the OpenLayers source instance for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Source} OpenLayers source instance. | ||
| */ | ||
| export function getSource(map: Map | LayerGroup, sourceId: string): Source; | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * | ||
| * The feature state will be stored on the OpenLayers layer matching the feature identifier, in the | ||
| * `mapbox-featurestate` property. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer OpenLayers Map or layer to set the feature | ||
| * state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @param {Object|null} state Feature state. Set to `null` to remove the feature state. | ||
| */ | ||
| export function setFeatureState(mapOrLayer: Map | import("ol/layer/Vector.js").default<any> | VectorTileLayer, feature: FeatureIdentifier, state: any | null): void; | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer Map or layer to set the feature state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @return {Object|null} Feature state or `null` when no feature state is set for the given | ||
| * feature identifier. | ||
| */ | ||
| export function getFeatureState(mapOrLayer: Map | import("ol/layer/Vector.js").default<any> | VectorTileLayer, feature: FeatureIdentifier): any | null; | ||
| /** | ||
| * Get the Mapbox Layer object for the provided `layerId`. | ||
| * @param {Map|LayerGroup} mapOrGroup Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Layer id. | ||
| * @return {Object} Mapbox Layer object. | ||
| */ | ||
| export function getMapboxLayer(mapOrGroup: Map | LayerGroup, layerId: string): any; | ||
| /** | ||
| * Add a new Mapbox Layer object to the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Mapbox Layer object. | ||
| * @param {string} [beforeLayerId] Optional id of the Mapbox Layer before the new layer that will be added. | ||
| */ | ||
| export function addMapboxLayer(mapOrGroup: Map | LayerGroup, mapboxLayer: any, beforeLayerId?: string | undefined): void; | ||
| /** | ||
| * Update a Mapbox Layer object in the style. The map will be re-rendered with the new style. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Updated Mapbox Layer object. | ||
| */ | ||
| export function updateMapboxLayer(mapOrGroup: Map | LayerGroup, mapboxLayer: any): void; | ||
| /** | ||
| * Remove a Mapbox Layer object from the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {string|Object} mapboxLayerIdOrLayer Mapbox Layer id or Mapbox Layer object. | ||
| */ | ||
| export function removeMapboxLayer(mapOrGroup: Map | LayerGroup, mapboxLayerIdOrLayer: string | any): void; | ||
| export const defaultResolutions: number[]; | ||
| export type Map = import("ol").Map; | ||
| export type Layer = import("ol/layer").Layer; | ||
| export type LayerGroup = import("ol/layer").Group; | ||
| export type VectorLayer = import("ol/layer/Vector.js").default<any>; | ||
| export type VectorTileLayer = import("ol/layer").VectorTile; | ||
| export type Source = import("ol/source").Source; | ||
| export type FeatureIdentifier = { | ||
| /** | ||
| * The feature id. | ||
| */ | ||
| id: string | number; | ||
| /** | ||
| * The source id. | ||
| */ | ||
| source: string; | ||
| }; | ||
| export type Options = import("./apply.js").Options; | ||
| export type ResourceType = import('./apply.js').ResourceType; |
| { | ||
| "name": "ol-mapbox-style", | ||
| "version": "10.3.3", | ||
| "version": "10.3.4", | ||
| "description": "Create OpenLayers maps from Mapbox Style objects", | ||
@@ -5,0 +5,0 @@ "type": "module", |
@@ -193,3 +193,3 @@ # ol-mapbox-style | ||
| | :-------------------- | :------------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| | `mapOrGroupOrElement` | `string` \| `HTMLElement` \| `Map` \| `LayerGroup` | Either an existing OpenLayers Map instance, or a HTML element, or the id of a HTML element that will be the target of a new OpenLayers Map, or a layer group. If layer group, styles releated to the map and view will be ignored. | | ||
| | `mapOrGroupOrElement` | `string` \| `Map` \| `LayerGroup` \| `HTMLElement` | Either an existing OpenLayers Map instance, or a HTML element, or the id of a HTML element that will be the target of a new OpenLayers Map, or a layer group. If layer group, styles releated to the map and view will be ignored. | | ||
| | `style` | `any` | JSON style object or style url pointing to a Mapbox Style object. When using Mapbox APIs, the url is the `styleUrl` shown in Mapbox Studio's "share" panel. In addition, the `accessToken` option (see below) must be set. When passed as JSON style object, all OpenLayers layers created by `apply()` will be immediately available, but they may not have a source yet (i.e. when they are defined by a TileJSON url in the Mapbox Style document). When passed as style url, layers will be added to the map when the Mapbox Style document is loaded and parsed. | | ||
@@ -230,3 +230,3 @@ | `options` | [`Options`](#interfacesinternal_optionsmd) | Options. | | ||
| | :----------- | :----------------------------------------- | :---------------------------------- | | ||
| | `mapOrLayer` | `VectorTileLayer` \| `Map` | OpenLayers Map or VectorTile layer. | | ||
| | `mapOrLayer` | `Map` \| `VectorTileLayer` | OpenLayers Map or VectorTile layer. | | ||
| | `glStyle` | `any` | Mapbox Style object or url. | | ||
@@ -306,3 +306,3 @@ | `options` | [`Options`](#interfacesinternal_optionsmd) | Options. | | ||
| | :----------- | :------------------------------------------------------------- | :---------------------------------------- | | ||
| | `mapOrLayer` | `VectorLayer`<`any`> \| `VectorTileLayer` \| `Map` | Map or layer to set the feature state on. | | ||
| | `mapOrLayer` | `Map` \| `VectorLayer`<`any`> \| `VectorTileLayer` | Map or layer to set the feature state on. | | ||
| | `feature` | [`FeatureIdentifier`](#interfacesinternal_featureidentifiermd) | Feature identifier. | | ||
@@ -480,3 +480,3 @@ | ||
| | :----------- | :------------------------------------------------------------- | :-------------------------------------------------------- | | ||
| | `mapOrLayer` | `VectorLayer`<`any`> \| `VectorTileLayer` \| `Map` | OpenLayers Map or layer to set the feature state on. | | ||
| | `mapOrLayer` | `Map` \| `VectorLayer`<`any`> \| `VectorTileLayer` | OpenLayers Map or layer to set the feature state on. | | ||
| | `feature` | [`FeatureIdentifier`](#interfacesinternal_featureidentifiermd) | Feature identifier. | | ||
@@ -493,3 +493,3 @@ | `state` | `any` | Feature state. Set to `null` to remove the feature state. | | ||
| ▸ **stylefunction**(`olLayer`, `glStyle`, `sourceOrLayers`, `resolutions?`, `spriteData?`, `spriteImageUrl?`, `getFonts?`, `getImage?`): `StyleFunction` | ||
| ▸ **stylefunction**(`olLayer`, `glStyle`, `sourceOrLayers`, `resolutions?`, `spriteData?`, `spriteImageUrl?`, `getFonts?`, `getImage?`, `...args`): `StyleFunction` | ||
@@ -544,2 +544,3 @@ Creates a style function from the `glStyle` object for all layers that use | ||
| | `getImage?` | (`arg0`: `VectorLayer`<`any`> \| `VectorTileLayer`, `arg1`: `string`) => `string` \| `HTMLCanvasElement` \| `HTMLImageElement` | `undefined` | Function that returns an image or a URL for an image name. If the result is an HTMLImageElement, it must already be loaded. The layer can be used to call layer.changed() when the loading and processing of the image has finished. This function can be used for icons not in the sprite or to override sprite icons. | | ||
| | `...args` | `any`\[] | `undefined` | - | | ||
@@ -546,0 +547,0 @@ ##### Returns |
217
src/apply.js
@@ -41,3 +41,2 @@ /* | ||
| fetchResource, | ||
| getFilterCache, | ||
| getFunctionCache, | ||
@@ -58,8 +57,2 @@ getGlStyle, | ||
| /** | ||
| * @typedef {Object} FeatureIdentifier | ||
| * @property {string|number} id The feature id. | ||
| * @property {string} source The source id. | ||
| */ | ||
| /** | ||
| * @typedef {Object} Options | ||
@@ -1221,212 +1214,2 @@ * @property {string} [accessToken] Access token for 'mapbox://' urls. | ||
| /** | ||
| * Get the OpenLayers layer instance that contains the provided Mapbox Style | ||
| * `layer`. Note that multiple Mapbox Style layers are combined in a single | ||
| * OpenLayers layer instance when they use the same Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Style layer id. | ||
| * @return {Layer} OpenLayers layer instance. | ||
| */ | ||
| export function getLayer(map, layerId) { | ||
| const layers = map.getLayers().getArray(); | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const mapboxLayers = layers[i].get('mapbox-layers'); | ||
| if (mapboxLayers && mapboxLayers.indexOf(layerId) !== -1) { | ||
| return /** @type {Layer} */ (layers[i]); | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * Get the OpenLayers layer instances for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Array<Layer>} OpenLayers layer instances. | ||
| */ | ||
| export function getLayers(map, sourceId) { | ||
| const result = []; | ||
| const layers = map.getLayers().getArray(); | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| if (layers[i].get('mapbox-source') === sourceId) { | ||
| result.push(/** @type {Layer} */ (layers[i])); | ||
| } | ||
| } | ||
| return result; | ||
| } | ||
| /** | ||
| * Get the OpenLayers source instance for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Source} OpenLayers source instance. | ||
| */ | ||
| export function getSource(map, sourceId) { | ||
| const layers = map.getLayers().getArray(); | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const source = /** @type {Layer} */ (layers[i]).getSource(); | ||
| if (layers[i].get('mapbox-source') === sourceId) { | ||
| return source; | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * | ||
| * The feature state will be stored on the OpenLayers layer matching the feature identifier, in the | ||
| * `mapbox-featurestate` property. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer OpenLayers Map or layer to set the feature | ||
| * state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @param {Object|null} state Feature state. Set to `null` to remove the feature state. | ||
| */ | ||
| export function setFeatureState(mapOrLayer, feature, state) { | ||
| const layers = | ||
| 'getLayers' in mapOrLayer | ||
| ? getLayers(mapOrLayer, feature.source) | ||
| : [mapOrLayer]; | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const featureState = layers[i].get('mapbox-featurestate'); | ||
| if (featureState) { | ||
| if (state) { | ||
| featureState[feature.id] = state; | ||
| } else { | ||
| delete featureState[feature.id]; | ||
| } | ||
| layers[i].changed(); | ||
| } else { | ||
| throw new Error(`Map or layer for source "${feature.source}" not found.`); | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer Map or layer to set the feature state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @return {Object|null} Feature state or `null` when no feature state is set for the given | ||
| * feature identifier. | ||
| */ | ||
| export function getFeatureState(mapOrLayer, feature) { | ||
| const layers = | ||
| 'getLayers' in mapOrLayer | ||
| ? getLayers(mapOrLayer, feature.source) | ||
| : [mapOrLayer]; | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const featureState = layers[i].get('mapbox-featurestate'); | ||
| if (featureState && featureState[feature.id]) { | ||
| return featureState[feature.id]; | ||
| } | ||
| } | ||
| return null; | ||
| } | ||
| /** | ||
| * Get the Mapbox Layer object for the provided `layerId`. | ||
| * @param {Map|LayerGroup} mapOrGroup Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Layer id. | ||
| * @return {Object} Mapbox Layer object. | ||
| */ | ||
| export function getMapboxLayer(mapOrGroup, layerId) { | ||
| const style = mapOrGroup.get('mapbox-style'); | ||
| const layerStyle = style.layers.find(function (layer) { | ||
| return layer.id === layerId; | ||
| }); | ||
| return layerStyle; | ||
| } | ||
| /** | ||
| * Add a new Mapbox Layer object to the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Mapbox Layer object. | ||
| * @param {string} [beforeLayerId] Optional id of the Mapbox Layer before the new layer that will be added. | ||
| */ | ||
| export function addMapboxLayer(mapOrGroup, mapboxLayer, beforeLayerId) { | ||
| const mapboxLayers = mapOrGroup.get('mapbox-style').layers; | ||
| let index; | ||
| if (beforeLayerId !== undefined) { | ||
| const beforeLayer = getMapboxLayer(mapOrGroup, beforeLayerId); | ||
| if (beforeLayer === undefined) { | ||
| throw new Error(`Layer with id "${beforeLayerId}" not found.`); | ||
| } | ||
| index = mapboxLayers.indexOf(beforeLayer); | ||
| } else { | ||
| index = mapboxLayers.length; | ||
| } | ||
| if (index === 0) { | ||
| throw new Error('Cannot add layer before first layer.'); | ||
| } | ||
| if (mapboxLayers[index - 1].source !== mapboxLayer.source) { | ||
| throw new Error('Added layer and layer before must use the same source.'); | ||
| } | ||
| if (mapboxLayers.some((layer) => layer.id === mapboxLayer.id)) { | ||
| throw new Error(`Layer with id "${mapboxLayer.id}" already exists.`); | ||
| } | ||
| mapboxLayers.splice(index, 0, mapboxLayer); | ||
| const layer = getLayer(mapOrGroup, mapboxLayers[index - 1].id); | ||
| const layerMapboxLayers = layer.get('mapbox-layers'); | ||
| const layerIndex = beforeLayerId | ||
| ? layerMapboxLayers.indexOf(beforeLayerId) | ||
| : layerMapboxLayers.length; | ||
| layerMapboxLayers.splice(layerIndex, 0, mapboxLayer.id); | ||
| layer.changed(); | ||
| } | ||
| /** | ||
| * Update a Mapbox Layer object in the style. The map will be re-rendered with the new style. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Updated Mapbox Layer object. | ||
| */ | ||
| export function updateMapboxLayer(mapOrGroup, mapboxLayer) { | ||
| const glStyle = mapOrGroup.get('mapbox-style'); | ||
| const mapboxLayers = glStyle.layers; | ||
| const index = mapboxLayers.findIndex(function (layer) { | ||
| return layer.id === mapboxLayer.id; | ||
| }); | ||
| if (index === -1) { | ||
| throw new Error(`Layer with id "${mapboxLayer.id}" not found.`); | ||
| } | ||
| const oldLayer = mapboxLayers[index]; | ||
| if (oldLayer.source !== mapboxLayer.source) { | ||
| throw new Error( | ||
| 'Updated layer and previous version must use the same source.' | ||
| ); | ||
| } | ||
| delete getFunctionCache(glStyle)[mapboxLayer.id]; | ||
| delete getFilterCache(glStyle)[mapboxLayer.id]; | ||
| mapboxLayers[index] = mapboxLayer; | ||
| getLayer(mapOrGroup, mapboxLayer.id).changed(); | ||
| } | ||
| /** | ||
| * Remove a Mapbox Layer object from the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {string|Object} mapboxLayerIdOrLayer Mapbox Layer id or Mapbox Layer object. | ||
| */ | ||
| export function removeMapboxLayer(mapOrGroup, mapboxLayerIdOrLayer) { | ||
| const mapboxLayerId = | ||
| typeof mapboxLayerIdOrLayer === 'string' | ||
| ? mapboxLayerIdOrLayer | ||
| : mapboxLayerIdOrLayer.id; | ||
| const layer = getLayer(mapOrGroup, mapboxLayerId); | ||
| /** @type {Array<Object>} */ | ||
| const layerMapboxLayers = layer.get('mapbox-layers'); | ||
| if (layerMapboxLayers.length === 1) { | ||
| throw new Error( | ||
| 'Cannot remove last Mapbox layer from an OpenLayers layer.' | ||
| ); | ||
| } | ||
| layerMapboxLayers.splice(layerMapboxLayers.indexOf(mapboxLayerId), 1); | ||
| const layers = mapOrGroup.get('mapbox-style').layers; | ||
| layers.splice( | ||
| layers.findIndex((layer) => layer.id === mapboxLayerId), | ||
| 1 | ||
| ); | ||
| layer.changed(); | ||
| } | ||
| export {finalizeLayer as _finalizeLayer}; |
@@ -6,7 +6,4 @@ export { | ||
| } from './stylefunction.js'; | ||
| export {apply as default, apply, applyBackground, applyStyle} from './apply.js'; | ||
| export { | ||
| apply as default, | ||
| apply, | ||
| applyBackground, | ||
| applyStyle, | ||
| getFeatureState, | ||
@@ -21,2 +18,2 @@ setFeatureState, | ||
| removeMapboxLayer, | ||
| } from './apply.js'; | ||
| } from './util.js'; |
@@ -30,2 +30,3 @@ /* | ||
| getFunctionCache, | ||
| getStyleFunctionKey, | ||
| getZoomForResolution, | ||
@@ -266,2 +267,4 @@ } from './util.js'; | ||
| export const styleFunctionArgs = {}; | ||
| /** | ||
@@ -350,2 +353,4 @@ * Creates a style function from the `glStyle` object for all layers that use | ||
| } | ||
| styleFunctionArgs[getStyleFunctionKey(glStyle, olLayer)] = | ||
| Array.from(arguments); | ||
@@ -1499,3 +1504,3 @@ let spriteImage, spriteImageSize; | ||
| olLayer.set('mapbox-layers', mapboxLayers); | ||
| olLayer.set('mapbox-featurestate', {}); | ||
| olLayer.set('mapbox-featurestate', olLayer.get('mapbox-featurestate') || {}); | ||
| return styleFunction; | ||
@@ -1502,0 +1507,0 @@ } |
294
src/util.js
@@ -0,8 +1,37 @@ | ||
| import { | ||
| stylefunction as applyStylefunction, | ||
| styleFunctionArgs, | ||
| } from './stylefunction.js'; | ||
| import {expandUrl} from 'ol/tileurlfunction.js'; | ||
| import {getUid} from 'ol'; | ||
| import {normalizeSourceUrl, normalizeStyleUrl} from './mapbox.js'; | ||
| let styleId = 0; | ||
| /** @typedef {import("ol").Map} Map */ | ||
| /** @typedef {import("ol/layer").Layer} Layer */ | ||
| /** @typedef {import("ol/layer").Group} LayerGroup */ | ||
| /** @typedef {import("ol/layer").Vector} VectorLayer */ | ||
| /** @typedef {import("ol/layer").VectorTile} VectorTileLayer */ | ||
| /** @typedef {import("ol/source").Source} Source */ | ||
| /** | ||
| * @typedef {Object} FeatureIdentifier | ||
| * @property {string|number} id The feature id. | ||
| * @property {string} source The source id. | ||
| */ | ||
| const functionCacheByStyleId = {}; | ||
| const filterCacheByStyleId = {}; | ||
| let styleId = 0; | ||
| export function getStyleId(glStyle) { | ||
| if (!glStyle.id) { | ||
| glStyle.id = styleId++; | ||
| } | ||
| return glStyle.id; | ||
| } | ||
| export function getStyleFunctionKey(glStyle, olLayer) { | ||
| return getStyleId(glStyle) + '.' + getUid(olLayer); | ||
| } | ||
| /** | ||
@@ -13,9 +42,6 @@ * @param {Object} glStyle Mapboox style object. | ||
| export function getFunctionCache(glStyle) { | ||
| if (!glStyle.id) { | ||
| glStyle.id = styleId++; | ||
| } | ||
| let functionCache = functionCacheByStyleId[glStyle.id]; | ||
| if (!functionCache) { | ||
| functionCache = {}; | ||
| functionCacheByStyleId[glStyle.id] = functionCache; | ||
| functionCacheByStyleId[getStyleId(glStyle)] = functionCache; | ||
| } | ||
@@ -36,9 +62,6 @@ return functionCache; | ||
| export function getFilterCache(glStyle) { | ||
| if (!glStyle.id) { | ||
| glStyle.id = styleId++; | ||
| } | ||
| let filterCache = filterCacheByStyleId[glStyle.id]; | ||
| if (!filterCache) { | ||
| filterCache = {}; | ||
| filterCacheByStyleId[glStyle.id] = filterCache; | ||
| filterCacheByStyleId[getStyleId(glStyle)] = filterCache; | ||
| } | ||
@@ -284,2 +307,255 @@ return filterCache; | ||
| /** | ||
| * Get the OpenLayers layer instance that contains the provided Mapbox Style | ||
| * `layer`. Note that multiple Mapbox Style layers are combined in a single | ||
| * OpenLayers layer instance when they use the same Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Style layer id. | ||
| * @return {Layer} OpenLayers layer instance. | ||
| */ | ||
| export function getLayer(map, layerId) { | ||
| const layers = map.getLayers().getArray(); | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const mapboxLayers = layers[i].get('mapbox-layers'); | ||
| if (mapboxLayers && mapboxLayers.indexOf(layerId) !== -1) { | ||
| return /** @type {Layer} */ (layers[i]); | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * Get the OpenLayers layer instances for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Array<Layer>} OpenLayers layer instances. | ||
| */ | ||
| export function getLayers(map, sourceId) { | ||
| const result = []; | ||
| const layers = map.getLayers().getArray(); | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| if (layers[i].get('mapbox-source') === sourceId) { | ||
| result.push(/** @type {Layer} */ (layers[i])); | ||
| } | ||
| } | ||
| return result; | ||
| } | ||
| /** | ||
| * Get the OpenLayers source instance for the provided Mapbox Style `source`. | ||
| * @param {Map|LayerGroup} map OpenLayers Map or LayerGroup. | ||
| * @param {string} sourceId Mapbox Style source id. | ||
| * @return {Source} OpenLayers source instance. | ||
| */ | ||
| export function getSource(map, sourceId) { | ||
| const layers = map.getLayers().getArray(); | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const source = /** @type {Layer} */ (layers[i]).getSource(); | ||
| if (layers[i].get('mapbox-source') === sourceId) { | ||
| return source; | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * | ||
| * The feature state will be stored on the OpenLayers layer matching the feature identifier, in the | ||
| * `mapbox-featurestate` property. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer OpenLayers Map or layer to set the feature | ||
| * state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @param {Object|null} state Feature state. Set to `null` to remove the feature state. | ||
| */ | ||
| export function setFeatureState(mapOrLayer, feature, state) { | ||
| const layers = | ||
| 'getLayers' in mapOrLayer | ||
| ? getLayers(mapOrLayer, feature.source) | ||
| : [mapOrLayer]; | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const featureState = layers[i].get('mapbox-featurestate'); | ||
| if (featureState) { | ||
| if (state) { | ||
| featureState[feature.id] = state; | ||
| } else { | ||
| delete featureState[feature.id]; | ||
| } | ||
| layers[i].changed(); | ||
| } else { | ||
| throw new Error(`Map or layer for source "${feature.source}" not found.`); | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * Sets or removes a feature state. The feature state is taken into account for styling, | ||
| * just like the feature's properties, and can be used e.g. to conditionally render selected | ||
| * features differently. | ||
| * @param {Map|VectorLayer|VectorTileLayer} mapOrLayer Map or layer to set the feature state on. | ||
| * @param {FeatureIdentifier} feature Feature identifier. | ||
| * @return {Object|null} Feature state or `null` when no feature state is set for the given | ||
| * feature identifier. | ||
| */ | ||
| export function getFeatureState(mapOrLayer, feature) { | ||
| const layers = | ||
| 'getLayers' in mapOrLayer | ||
| ? getLayers(mapOrLayer, feature.source) | ||
| : [mapOrLayer]; | ||
| for (let i = 0, ii = layers.length; i < ii; ++i) { | ||
| const featureState = layers[i].get('mapbox-featurestate'); | ||
| if (featureState && featureState[feature.id]) { | ||
| return featureState[feature.id]; | ||
| } | ||
| } | ||
| return null; | ||
| } | ||
| /** | ||
| * Get the Mapbox Layer object for the provided `layerId`. | ||
| * @param {Map|LayerGroup} mapOrGroup Map or LayerGroup. | ||
| * @param {string} layerId Mapbox Layer id. | ||
| * @return {Object} Mapbox Layer object. | ||
| */ | ||
| export function getMapboxLayer(mapOrGroup, layerId) { | ||
| const style = mapOrGroup.get('mapbox-style'); | ||
| const layerStyle = style.layers.find(function (layer) { | ||
| return layer.id === layerId; | ||
| }); | ||
| return layerStyle; | ||
| } | ||
| /** | ||
| * Add a new Mapbox Layer object to the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Mapbox Layer object. | ||
| * @param {string} [beforeLayerId] Optional id of the Mapbox Layer before the new layer that will be added. | ||
| */ | ||
| export function addMapboxLayer(mapOrGroup, mapboxLayer, beforeLayerId) { | ||
| const mapboxLayers = mapOrGroup.get('mapbox-style').layers; | ||
| let index; | ||
| if (beforeLayerId !== undefined) { | ||
| const beforeLayer = getMapboxLayer(mapOrGroup, beforeLayerId); | ||
| if (beforeLayer === undefined) { | ||
| throw new Error(`Layer with id "${beforeLayerId}" not found.`); | ||
| } | ||
| index = mapboxLayers.indexOf(beforeLayer); | ||
| } else { | ||
| index = mapboxLayers.length; | ||
| } | ||
| if (index === 0) { | ||
| throw new Error('Cannot add layer before first layer.'); | ||
| } | ||
| if (mapboxLayers[index - 1].source !== mapboxLayer.source) { | ||
| throw new Error('Added layer and layer before must use the same source.'); | ||
| } | ||
| if (mapboxLayers.some((layer) => layer.id === mapboxLayer.id)) { | ||
| throw new Error(`Layer with id "${mapboxLayer.id}" already exists.`); | ||
| } | ||
| mapboxLayers.splice(index, 0, mapboxLayer); | ||
| const args = | ||
| styleFunctionArgs[ | ||
| getStyleFunctionKey( | ||
| mapOrGroup.get('mapbox-style'), | ||
| getLayer(mapOrGroup, mapboxLayers[index - 1].id) | ||
| ) | ||
| ]; | ||
| if (args) { | ||
| const [ | ||
| olLayer, | ||
| glStyle, | ||
| sourceOrLayers, | ||
| resolutions, | ||
| spriteData, | ||
| spriteImageUrl, | ||
| getFonts, | ||
| getImage, | ||
| ] = args; | ||
| if (Array.isArray(sourceOrLayers)) { | ||
| const layerIndex = beforeLayerId | ||
| ? sourceOrLayers.indexOf(beforeLayerId) | ||
| : sourceOrLayers.length; | ||
| sourceOrLayers.splice(layerIndex, 0, mapboxLayer.id); | ||
| } | ||
| applyStylefunction( | ||
| olLayer, | ||
| glStyle, | ||
| sourceOrLayers, | ||
| resolutions, | ||
| spriteData, | ||
| spriteImageUrl, | ||
| getFonts, | ||
| getImage | ||
| ); | ||
| } else { | ||
| getLayer(mapOrGroup, mapboxLayers[index - 1].id).changed(); | ||
| } | ||
| } | ||
| /** | ||
| * Update a Mapbox Layer object in the style. The map will be re-rendered with the new style. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {Object} mapboxLayer Updated Mapbox Layer object. | ||
| */ | ||
| export function updateMapboxLayer(mapOrGroup, mapboxLayer) { | ||
| const glStyle = mapOrGroup.get('mapbox-style'); | ||
| const mapboxLayers = glStyle.layers; | ||
| const index = mapboxLayers.findIndex(function (layer) { | ||
| return layer.id === mapboxLayer.id; | ||
| }); | ||
| if (index === -1) { | ||
| throw new Error(`Layer with id "${mapboxLayer.id}" not found.`); | ||
| } | ||
| const oldLayer = mapboxLayers[index]; | ||
| if (oldLayer.source !== mapboxLayer.source) { | ||
| throw new Error( | ||
| 'Updated layer and previous version must use the same source.' | ||
| ); | ||
| } | ||
| delete getFunctionCache(glStyle)[mapboxLayer.id]; | ||
| delete getFilterCache(glStyle)[mapboxLayer.id]; | ||
| applyStylefunction.apply( | ||
| undefined, | ||
| styleFunctionArgs[ | ||
| getStyleFunctionKey( | ||
| mapOrGroup.get('mapbox-style'), | ||
| getLayer(mapOrGroup, mapboxLayer.id) | ||
| ) | ||
| ] | ||
| ); | ||
| } | ||
| /** | ||
| * Remove a Mapbox Layer object from the style. The map will be re-rendered. | ||
| * @param {Map|LayerGroup} mapOrGroup The Map or LayerGroup `apply` was called on. | ||
| * @param {string|Object} mapboxLayerIdOrLayer Mapbox Layer id or Mapbox Layer object. | ||
| */ | ||
| export function removeMapboxLayer(mapOrGroup, mapboxLayerIdOrLayer) { | ||
| const mapboxLayerId = | ||
| typeof mapboxLayerIdOrLayer === 'string' | ||
| ? mapboxLayerIdOrLayer | ||
| : mapboxLayerIdOrLayer.id; | ||
| const layer = getLayer(mapOrGroup, mapboxLayerId); | ||
| /** @type {Array<Object>} */ | ||
| const layerMapboxLayers = layer.get('mapbox-layers'); | ||
| if (layerMapboxLayers.length === 1) { | ||
| throw new Error( | ||
| 'Cannot remove last Mapbox layer from an OpenLayers layer.' | ||
| ); | ||
| } | ||
| layerMapboxLayers.splice(layerMapboxLayers.indexOf(mapboxLayerId), 1); | ||
| const layers = mapOrGroup.get('mapbox-style').layers; | ||
| layers.splice( | ||
| layers.findIndex((layer) => layer.id === mapboxLayerId), | ||
| 1 | ||
| ); | ||
| applyStylefunction.apply( | ||
| undefined, | ||
| styleFunctionArgs[ | ||
| getStyleFunctionKey(mapOrGroup.get('mapbox-style'), layer) | ||
| ] | ||
| ); | ||
| } | ||
| /** | ||
| * @typedef {import("./apply.js").Options} Options | ||
@@ -286,0 +562,0 @@ * @typedef {import('./apply.js').ResourceType} ResourceType |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.18%
6491713
- Lines of code
- increased by0.42%
21732
- Number of lines in readme file
- increased by0.13%
775
No dependency changes