@arcgis/core/views/2d/layers/VectorTileLayerView2D.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
*/
import{_ as e}from"../../../chunks/tslib.es6.js";import{clone as t}from"../../../core/lang.js";import i from"../../../core/Logger.js";import{destroyMaybe as s}from"../../../core/maybe.js";import{isAbortError as r}from"../../../core/promiseUtils.js";import{property as a}from"../../../core/accessorSupport/decorators/property.js";import"../../../core/has.js";import{subclass as l}from"../../../core/accessorSupport/decorators/subclass.js";import{diff as n,hasDiff as o}from"../../../core/accessorSupport/diffUtils.js";import h from"../../../geometry/Point.js";import{create as u}from"../../../geometry/support/aaBoundingRect.js";import{equals as y}from"../../../geometry/support/spatialReferenceUtils.js";import{StyleUpdateType as c}from"../engine/vectorTiles/enums.js";import{TileHandler as d}from"../engine/vectorTiles/TileHandler.js";import{TileManager as _}from"../engine/vectorTiles/TileManager.js";import{VectorTile as p}from"../engine/vectorTiles/VectorTile.js";import{VectorTileContainer as f}from"../engine/vectorTiles/VectorTileContainer.js";import g from"../engine/vectorTiles/VectorTileFeatureIndex.js";import{StyleLayerType as m}from"../engine/vectorTiles/style/StyleDefinition.js";import T from"../engine/vectorTiles/style/StyleRepository.js";import{LayerView2DMixin as C}from"./LayerView2D.js";import R from"../tiling/TileInfoViewPOT.js";import v from"../tiling/TileQueue.js";import H from"../../layers/LayerView.js";import w from"../../layers/RefreshableLayerView.js";import{TaskPriority as I}from"../../support/Scheduler.js";const S=2,D=8,P=512;let Q=class extends(w(C(H))){constructor(){super(...arguments),this._styleChanges=[],this._fetchQueue=null,this._parseQueue=null,this._tileHandlerPromise=null,this._isTileHandlerReady=!1,this._styeChanged=!1,this._spriteSourceChanged=!1}get fading(){return this._vectorTileContainer?.fading??!1}get hasVisibleFeatures(){const e=this._vectorTileContainer.children;for(const t of e)if(t.hasFeatures())return!0;return!1}get spriteSourceChanged(){return this._spriteSourceChanged}get styleChanged(){return this._styeChanged}async hitTest(e,t){const i=this._tileHandlerPromise,s=this._vectorTileContainer?.symbolFader;if(!i||!this._isTileHandlerReady||!s)return;await i;let r=null;const a=this._vectorTileContainer?.symbolRepository;a&&(r=a.querySymbols(t,S,s.decluttererOffset,{}));const l=this.view.state,n=this._tileManager.getIntersectingTiles(t.x,t.y,S,l,r);if((!n||0===n.length)&&0===r?.length)return null;e=e.clone().normalize();const o=[],h=[];for(const u of n)o.push(this._queryTile(h,e,S,this.view.state.rotation,u,r?.filter((e=>e.tileKey.id===u.id))));return await Promise.all(o),h}update(e){if(this._tileHandlerPromise&&this._isTileHandlerReady)return e.pixelRatio!==this._tileHandler.devicePixelRatio?(this._tileHandler.devicePixelRatio=e.pixelRatio,void this._loadStyle()):void(this._styleChanges.length>0?this._tileHandlerPromise=this._applyStyleChanges():(this._pauseQueues(),this._fetchQueue.state=e.state,this._parseQueue.state=e.state,this._tileManager.update(e)||this.requestUpdate(),this._resumeQueues()))}attach(){const{style:e}=this.layer.currentStyleInfo;this._styleRepository=new T(e),this._tileInfoView=new R(this.layer.tileInfo,this.layer.fullExtent),this._vectorTileContainer=new f(this._tileInfoView),this._tileHandler=new d(this.layer,this._styleRepository,window.devicePixelRatio||1,this.layer.tileInfo.lods.length-1),this.container.addChild(this._vectorTileContainer),this._start(),this.addAttachHandles([this.layer.on("paint-change",(e=>{if(this._styeChanged=!0,e.isDataDriven)this._styleChanges.push({type:c.PAINTER_CHANGED,data:e}),this.requestUpdate();else{const t=this._styleRepository,i=t.getLayerById(e.layer);if(!i)return;const s=i.type===m.SYMBOL;t.setPaintProperties(e.layer,e.paint),s&&this._vectorTileContainer?.restartDeclutter(),this._vectorTileContainer?.requestRender()}})),this.layer.on("layout-change",(e=>{const t=this._styleRepository,i=t.getLayerById(e.layer);if(!i)return;this._styeChanged=!0;const s=n(i.layout,e.layout);if(null!=s){if(o(s,"visibility")&&1===E(s))return t.setLayoutProperties(e.layer,e.layout),i.type===m.SYMBOL&&this._vectorTileContainer?.restartDeclutter(),void this._vectorTileContainer?.requestRender();this._styleChanges.push({type:c.LAYOUT_CHANGED,data:e}),this.requestUpdate()}})),this.layer.on("style-layer-visibility-change",(e=>{const t=this._styleRepository,i=t.getLayerById(e.layer);i&&(this._styeChanged=!0,t.setStyleLayerVisibility(e.layer,e.visibility),i.type===m.SYMBOL&&this._vectorTileContainer?.restartDeclutter(),this._vectorTileContainer?.requestRender())})),this.layer.on("style-layer-change",(e=>{this._styleChanges.push({type:c.LAYER_CHANGED,data:e}),this._styeChanged=!0,this.requestUpdate()})),this.layer.on("delete-style-layer",(e=>{this._styleChanges.push({type:c.LAYER_REMOVED,data:e}),this._styeChanged=!0,this.requestUpdate()})),this.layer.on("load-style",(()=>this._loadStyle())),this.layer.on("spriteSource-change",(e=>{this._spriteSourceChanged=!0,this._styleChanges.push({type:c.SPRITES_CHANGED,data:e});const t=this._styleRepository.layers;for(const i of t)switch(i.type){case m.SYMBOL:i.getLayoutProperty("icon-image")&&this._styleChanges.push({type:c.LAYOUT_CHANGED,data:{layer:i.id,layout:i.layout}});break;case m.LINE:i.getPaintProperty("line-pattern")&&this._styleChanges.push({type:c.PAINTER_CHANGED,data:{layer:i.id,paint:i.paint,isDataDriven:i.isPainterDataDriven()}});break;case m.FILL:i.getLayoutProperty("fill-pattern")&&this._styleChanges.push({type:c.PAINTER_CHANGED,data:{layer:i.id,paint:i.paint,isDataDriven:i.isPainterDataDriven()}})}this.requestUpdate()}))])}detach(){this._stop(),this.container.removeAllChildren(),this._vectorTileContainer=s(this._vectorTileContainer),this._tileHandler=s(this._tileHandler)}viewChange(){this.requestUpdate()}moveEnd(){this.requestUpdate()}supportsSpatialReference(e){return y(this.layer.tileInfo?.spatialReference,e)}canResume(){let e=super.canResume();const{currentStyleInfo:t}=this.layer;if(e&&t?.layerDefinition){const i=this.view.scale,{minScale:s,maxScale:r}=t.layerDefinition;t?.layerDefinition&&(s&&s<i&&(e=!1),r&&r>i&&(e=!1))}return e}isUpdating(){return this.fading}acquireTile(e){const t=this._createVectorTile(e);return this._updatingHandles.addPromise(this._fetchQueue.push(t.key).then((e=>this._parseQueue.push({key:t.key,data:e}))).then((e=>{t.once("attach",(()=>this.requestUpdate())),t.setData(e),this.requestUpdate()})).catch((e=>{r(e)||i.getLogger(this).error(e)}))),t}releaseTile(e){const t=e.key.id;this._fetchQueue.abort(t),this._parseQueue.abort(t),this.requestUpdate()}async doRefresh(){if(!this.attached)return;if(this.suspended)return this._tileManager.clear(),void this.requestUpdate();this._isTileHandlerReady=!1,this._pauseQueues(),this._clearQueues(),this._tileManager.clearCache(),this._resumeQueues();const e=this._vectorTileContainer.children,t=[];try{for(const i of e){const e=this._updatingHandles.addPromise(this._fetchQueue.push(i.key).then((e=>this._parseQueue.push({key:i.key,data:e}))).then((e=>i.setData(e))).finally((()=>i.featureIndex=null)));t.push(e)}await Promise.all(t)}catch(s){i.getLogger(this).error("error refreshing vector-tiles layer-view",s),this._resumeQueues(),this._isTileHandlerReady=!0}this._isTileHandlerReady=!0,this.requestUpdate()}_start(){if(this._stop(),this._tileManager=new _({acquireTile:e=>this.acquireTile(e),releaseTile:e=>this.releaseTile(e),tileInfoView:this._tileInfoView},this._vectorTileContainer),!this.layer.currentStyleInfo)return;const e=new AbortController,t=this._tileHandler.start({signal:e.signal}).then((()=>{this._fetchQueue=new v({tileInfoView:this._tileInfoView,process:(e,t)=>this._getTileData(e,t),concurrency:15,scheduler:this.scheduler,priority:I.MAPVIEW_FETCH_QUEUE}),this._parseQueue=new v({tileInfoView:this._tileInfoView,process:(e,t)=>this._parseTileData(e,t),concurrency:8,scheduler:this.scheduler,priority:I.MAPVIEW_VECTOR_TILE_PARSING_QUEUE}),this.requestUpdate(),this._isTileHandlerReady=!0}));this._tileHandler.spriteMosaic.then((e=>{this._vectorTileContainer.setStyleResources(e,this._tileHandler.glyphMosaic,this._styleRepository,this._tileInfoView),this.requestUpdate()})),this._tileHandlerAbortController=e,this._tileHandlerPromise=t}_stop(){if(!this._tileHandlerAbortController||!this._vectorTileContainer)return;const e=this._tileHandlerAbortController;e&&e.abort(),this._tileHandlerPromise=null,this._isTileHandlerReady=!1,this._fetchQueue=s(this._fetchQueue),this._parseQueue=s(this._parseQueue),this._tileManager=s(this._tileManager),this._vectorTileContainer.removeAllChildren()}async _getTileData(e,t){return this._tileHandler.fetchTileData(e,t)}async _parseTileData(e,t){return this._tileHandler.parseTileData(e,t)}async _applyStyleChanges(){this._isTileHandlerReady=!1,this._pauseQueues(),this._clearQueues(),this._tileManager.clearCache();const e=this._styleChanges;try{await this._tileHandler.updateStyle(e)}catch(l){i.getLogger(this).error("error applying vector-tiles style update",l.message),this._resumeQueues(),this._isTileHandlerReady=!0}const t=this._styleRepository,s=new Set;e.forEach((e=>{if(e.type!==c.LAYER_REMOVED)return;const i=e.data,r=t.getLayerById(i.layer);r&&s.add(r.uid)}));const r=new Set;e.forEach((e=>{let i;switch(e.type){case c.PAINTER_CHANGED:t.setPaintProperties(e.data.layer,e.data.paint),i=e.data.layer;break;case c.LAYOUT_CHANGED:t.setLayoutProperties(e.data.layer,e.data.layout),i=e.data.layer;break;case c.LAYER_REMOVED:return void t.deleteStyleLayer(e.data.layer);case c.LAYER_CHANGED:t.setStyleLayer(e.data.layer,e.data.index),i=e.data.layer.id;break;case c.SPRITES_CHANGED:this._vectorTileContainer.setSpriteMosaic(this._tileHandler.setSpriteSource(e.data.spriteSource))}if(i){const e=t.getLayerById(i);e&&r.add(e.uid)}}));const a=this._vectorTileContainer.children;if(s.size>0){const e=Array.from(s);this._vectorTileContainer.deleteStyleLayers(e);for(const t of a)t.deleteLayerData(e)}if(this._resumeQueues(),r.size>0){const e=Array.from(r),t=[];for(const i of a){const s=this._updatingHandles.addPromise(this._fetchQueue.push(i.key).then((t=>this._parseQueue.push({key:i.key,data:t,styleLayerUIDs:e}))).then((e=>i.setData(e))).finally((()=>i.featureIndex=null)));t.push(s)}await Promise.all(t)}this._styleChanges=[],this._isTileHandlerReady=!0,this.requestUpdate()}async _loadStyle(){const{style:e}=this.layer.currentStyleInfo,i=t(e);this._isTileHandlerReady=!1,this._pauseQueues(),this._clearQueues(),this._styleRepository=new T(i),this._vectorTileContainer.destroy(),this._tileManager.clear(),this._tileHandlerAbortController.abort(),this._tileHandlerAbortController=new AbortController;const{signal:s}=this._tileHandlerAbortController;try{this._tileHandlerPromise=this._tileHandler.setStyle(this._styleRepository,i,this.layer.tileInfo.lods.length-1),await this._tileHandlerPromise}catch(n){if(!r(n))throw n}if(s.aborted)return this._resumeQueues(),this._isTileHandlerReady=!0,this._styeChanged=!1,this._spriteSourceChanged=!1,void this.requestUpdate();const a=await this._tileHandler.spriteMosaic,l=this._vectorTileContainer;this._tileInfoView=new R(this.layer.tileInfo,this.layer.fullExtent),l.setStyleResources(a,this._tileHandler.glyphMosaic,this._styleRepository,this._tileInfoView),this._tileManager=new _({acquireTile:e=>this.acquireTile(e),releaseTile:e=>this.releaseTile(e),tileInfoView:this._tileInfoView},this._vectorTileContainer),this._resumeQueues(),this._isTileHandlerReady=!0,this.requestUpdate(),this._styeChanged=!1,this._spriteSourceChanged=!1}_createVectorTile(e){const t=this._tileInfoView.getTileBounds(u(),e),i=this._tileInfoView.getTileResolution(e.level);return new p(e,i,t[0],t[3],512,512,this._styleRepository)}async _queryTile(e,t,i,s,r,a){if(0===r.layerData.size)return;const l=this._ensureTileIndex(r),n=this._tileInfoView.getTileBounds(u(),r.key,!0),o=D*P*((t.x-n[0])/(n[2]-n[0])),h=D*P*(1-(t.y-n[1])/(n[3]-n[1])),y=await l.queryAttributes(o,h,i,s,a);for(const u of y)u.graphic.geometry=this._tileToMapPoint(u.tilePoint,r.transforms.tileUnitsToPixels),e.push({type:"graphic",layer:this.layer,graphic:u.graphic,mapPoint:t.clone()});e.sort(((e,t)=>t.graphic.origin.layerIndex-e.graphic.origin.layerIndex))}_tileToMapPoint(e,t){if(!e)return null;const i=e[0]*t[0]+e[1]*t[3]+t[6],s=e[0]*t[1]+e[1]*t[4]+t[7],r=this.view.state,a=[0,0];return r.toMap(a,[i,s]),new h({x:a[0],y:a[1],spatialReference:r.spatialReference})}_ensureTileIndex(e){let t=e.featureIndex;return t||(t=g.create(e.key,e.layerData,this._styleRepository,this._tileHandler,this.layer),e.featureIndex=t),t}_pauseQueues(){this._fetchQueue.pause(),this._parseQueue.pause()}_resumeQueues(){this._fetchQueue.resume(),this._parseQueue.resume()}_clearQueues(){this._fetchQueue.clear(),this._parseQueue.clear()}};function E(e){if(null==e)return 0;switch(e.type){case"partial":return Object.keys(e.diff).length;case"complete":return Math.max(Object.keys(e.oldValue).length,Object.keys(e.newValue).length);case"collection":return Object.keys(e.added).length+Object.keys(e.changed).length+Object.keys(e.removed).length}}e([a()],Q.prototype,"_isTileHandlerReady",void 0),Q=e([l("esri.views.2d.layers.VectorTileLayerView2D")],Q);const A=Q;export{A as default};