esri-map-view
Version:
Display an Esri map view as a web component.
1 lines • 23.8 kB
JavaScript
import{r as t,c as i,g as s,h as e,a as h}from"./p-yT2zF3jg.js";var n,a={exports:{}},r=(n||(n=1,function(t){var i={Promise:"undefined"!=typeof window?window.Promise:void 0},s="4.25",e="next";function h(t){if(t.toLowerCase()===e)return e;var i=t&&t.match(/^(\d)\.(\d+)/);return i&&{major:parseInt(i[1],10),minor:parseInt(i[2],10)}}function n(t){return void 0===t&&(t=s),"https://js.arcgis.com/".concat(t,"/")}function a(t){return!t||h(t)?function(t){void 0===t&&(t=s);var i=n(t),a=h(t);if(a!==e&&3===a.major){var r=a.minor<=10?"js/":"";return"".concat(i).concat(r,"esri/css/esri.css")}return"".concat(i,"esri/themes/light/main.css")}(t):t}function r(t,i){var s=a(t),e=function(t){return document.querySelector('link[href*="'.concat(t,'"]'))}(s);return e||function(t,i){if(i){var s=document.querySelector(i);s.parentNode.insertBefore(t,s)}else document.head.appendChild(t)}(e=function(t){var i=document.createElement("link");return i.rel="stylesheet",i.href=t,i}(s),i),e}var o={};function l(t,i,s){var e;s&&(e=function(t,i){var s=function(e){i(e.error||new Error("There was an error attempting to load ".concat(t.src))),t.removeEventListener("error",s,!1)};return t.addEventListener("error",s,!1),s}(t,s));var h=function(){i(t),t.removeEventListener("load",h,!1),e&&t.removeEventListener("error",e,!1)};t.addEventListener("load",h,!1)}function c(){return document.querySelector("script[data-esri-loader]")}function u(){var t=window.require;return t&&t.on}function d(t){void 0===t&&(t={});var s={};[o,t].forEach((function(t){for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(s[i]=t[i])}));var e=s.version,h=s.url||n(e);return new i.Promise((function(t,i){var n=c();if(n){var a=n.getAttribute("src");a!==h?i(new Error("The ArcGIS API for JavaScript is already loaded (".concat(a,")."))):u()?t(n):l(n,t,i)}else if(u())i(new Error("The ArcGIS API for JavaScript is already loaded."));else{var o=s.css;o&&r(!0===o?e:o,s.insertCssBefore),l(n=function(t){var i=document.createElement("script");return i.type="text/javascript",i.src=t,i.setAttribute("data-esri-loader","loading"),i}(h),(function(){n.setAttribute("data-esri-loader","loaded"),t(n)}),i),document.body.appendChild(n)}}))}function p(t){return new i.Promise((function(i,s){var e=window.require.on("error",s);window.require(t,(function(){for(var t=[],s=0;s<arguments.length;s++)t[s]=arguments[s];e.remove(),i(t)}))}))}t.utils=i,t.loadModules=function(t,i){if(void 0===i&&(i={}),u())return p(t);var s=c(),e=s&&s.getAttribute("src");return!i.url&&e&&(i.url=e),d(i).then((function(){return p(t)}))},t.getScript=c,t.isLoaded=u,t.loadScript=d,t.setDefaultOptions=function(t){void 0===t&&(t={}),o=t},t.loadCss=r,Object.defineProperty(t,"__esModule",{value:!0})}(a.exports)),a.exports);function o(t){null!=t&&""!=t||(t="0,0,2");let i=t.split(",");return i.length<3&&(i[2]=2),{longitude:parseFloat(i[0])||0,latitude:parseFloat(i[1])||0,levelOfDetail:parseInt(i[2])||2,scale:0}}function l(t,i,s){let e,h;null!=t&&""!=t||(t=`${i},${s}`);let n=t.split(",");if(n.length<1?(n[0]=i,n[1]=s):n.length<2&&(n[1]=n[0]),e=parseInt(n[0]),Number.isNaN(e)&&(e=i),h=parseInt(n[1]),Number.isNaN(h)&&(h=s),h<e){const t=h;h=e,e=t}return e<i&&(e=i),h>s&&(h=s),{min:e,max:h}}function c(t){null==t&&(t="0,0");let i=t.split(",");return{x:parseFloat(i[0])||0,y:parseFloat(i[1])||0}}function u(t){return/^[a-f0-9]{32}$/.test(t)}function d(t){return/^http(s)?:\/\//.test(t)}function p(t){return["top-left","top-right","bottom-left","bottom-right","off"].indexOf(t)>=0}function w(t){const i=t?t.toLocaleLowerCase():"";return!(["false","off","hide","disable","0"].indexOf(i)>=0)}const m=class{watchAPIKeyHandler(t,i){t!=i&&(this.esriConfig.apiKey=t)}watchBasemapHandler(t,i){const s=this;s.viewChangePending||s.mapChangePending?s.mapLoadError.emit(new Error("Cannot change the map while a viewpoint change is in process.")):t!=i&&(s.mapChangePending=!0,s.updateEsriMap(t).then((()=>{s.basemap=t,s.mapChangePending=!1,s.mapLoaded.emit("loaded"),s.layers&&s.addLayers(s.layers)})).catch((t=>{s.mapChangePending=!1,s.mapLoadError.emit(t.toString())})))}watchWebmapHandler(t,i){this.viewChangePending||this.mapChangePending?this.mapLoadError.emit(new Error("Cannot change the map while a viewpoint change is in process.")):t!=i&&(this.mapChangePending=!0,this.webmap=t,this.createEsriMap().then((()=>{this.esriMapView&&this.esriWebMap&&(this.esriMapView.map=this.esriWebMap),this.mapChangePending=!1,this.mapLoaded.emit("loaded"),this.layers&&this.addLayers(this.layers)})).catch((t=>{console.log(`web map change, Map loading failed ${t.toString()}`),this.mapChangePending=!1,this.mapLoadError.emit(t.toString())})))}watchViewPointHandler(t,i){const s=this;if(s.viewChangePending||s.mapChangePending)s.mapLoadError.emit(new Error("Cannot change the viewpoint while a map change is in process."));else if(t!=i)if(s.parsedViewpoint=!1,s.viewpoint=t,s.verifyViewpoint()){if(null==s.esriMapView)return;s.viewChangePending=!0,s.esriMapView.goTo({center:[s.longitude,s.latitude],zoom:s.levelOfDetail}).then((function(){s.viewChangePending=!1,s.addGraphics()})).catch((function(){s.viewChangePending=!1,s.viewpoint=i,s.verifyViewpoint()}))}else s.viewpoint=i,s.verifyViewpoint()}watchLayersHandler(t,i){t!=i&&(this.layers=t,this.addLayers(t))}watchSearchHandler(t,i){t!=i&&(this.removeSearchWidget(),this.search=t,this.verifySearch()&&this.createSearchWidget(this.search))}watchSymbolHandler(t,i){t!=i&&(this.symbol=t,this.addGraphics())}watchSymbolOffsetHandler(t,i){t!=i&&(this.symboloffset=t,this.parsedOffset=c(t),this.addGraphics())}watchPopupTitleHandler(t,i){t!=i&&(this.popuptitle=t,this.addGraphics())}watchPopupInfoHandler(t,i){t!=i&&(this.popupinfo=t,this.addGraphics())}watchUIHandler(t,i){t!=i&&this.constrainUI(t,!1)}watchMinMaxZoomHandler(t,i){t!=i&&(this.minmaxzoom=t,this.verifyMinMaxZoom()||(this.minmaxzoom=i,this.verifyMinMaxZoom()))}constructor(e){t(this,e),this.mapLoaded=i(this,"mapLoaded"),this.mapLoadError=i(this,"mapLoadError"),this.ArcGISJavaScriptVersion="4.34",this.assetPath=s("./assets/"),this.mapViewWidgets=["zoom"],this.esriMap=null,this.esriWebMap=null,this.esriMapView=null,this.symbolGraphic=null,this.searchWidget=null,this.longitude=0,this.latitude=0,this.levelOfDetail=2,this.minZoom=0,this.maxZoom=24,this.parsedViewpoint=!1,this.defaultBasemap="osm-streets",this.viewChangePending=!1,this.mapChangePending=!1,this.esriMapOptions={url:`https://js.arcgis.com/${this.ArcGISJavaScriptVersion}/`,css:!0},this.apikey="YOUR_API_KEY",this.basemap="osm-streets",this.webmap="",this.viewpoint="",this.layers="",this.search="",this.symbol="",this.symboloffset="",this.popuptitle="",this.popupinfo="",this.ui="",this.minmaxzoom="",this.verifyProps(),r.setDefaultOptions(this.esriMapOptions),r.loadCss(`${this.esriMapOptions.url}/esri/css/main.css`),this.setAuthentication().then((()=>{this.createEsriMap().then((()=>{this.mapLoaded.emit("map-created")})).catch((t=>{console.log(`Map loading failed ${t.toString()}`),this.mapLoadError.emit(t.toString())}))})).catch((t=>{console.log(`Authentication failed ${t.toString()}`),this.mapLoadError.emit(t.toString())}))}componentDidLoad(){this.createEsriMapView().then((()=>{this.mapLoaded.emit("view-created"),this.symbol&&this.addGraphics()}))}setAuthentication(){return new Promise(((t,i)=>{r.loadModules(["esri/config"]).then((([i])=>{this.esriConfig=i,this.apikey?this.esriConfig.apiKey=this.apikey:this.esriConfig.request.useIdentity=!0,t()})).catch((t=>{i(t)}))}))}async createEsriMap(){return new Promise(((t,i)=>{u(this.webmap)?this.updateEsriWebMap(this.webmap).then((()=>{t()})).catch((t=>{i(t)})):this.updateEsriMap(this.basemap).then((()=>{t()})).catch((t=>{i(t)}))}))}async updateEsriWebMap(t){return new Promise(((i,s)=>{r.loadModules(["esri/WebMap"]).then((([s])=>{this.esriWebMap=new s({portalItem:{id:t}}),i()})).catch((t=>{s(t)}))}))}async updateEsriMap(t){return new Promise(((i,s)=>{u(t)?r.loadModules(["esri/Map","esri/Basemap","esri/layers/VectorTileLayer"]).then((([s,e,h])=>{const n=new e({baseLayers:[new h({portalItem:{id:t}})]});this.esriMap?this.esriMap.basemap=n:this.esriMap=new s({basemap:n}),i()})).catch((t=>{s(t)})):r.loadModules(["esri/Map","esri/Basemap"]).then((([s,e])=>{const h=new e({style:{id:t,language:"en"}});this.esriMap?this.esriMap.basemap=h:this.esriMap=new s({basemap:h}),i()})).catch((t=>{s(t)}))}))}async createEsriMapView(){const[t]=await r.loadModules(["esri/views/MapView"]),i=this.hostElement.querySelector("div");this.webmap&&!this.parsedViewpoint?null==this.esriMapView?this.esriMapView=new t({container:i,map:this.esriWebMap}):this.esriMapView.map=this.esriWebMap:null==this.esriMapView?this.esriMapView=new t({container:i,zoom:this.levelOfDetail,center:[this.longitude,this.latitude],map:this.esriMap||this.esriWebMap}):this.esriMapView.map=this.esriMap||this.esriWebMap,this.esriMapView&&(this.constrainUI(this.ui,!0),this.layers&&this.addLayers(this.layers),p(this.search)&&"off"!=this.search&&this.createSearchWidget(this.search))}addLayers(t){const i=t.split(",");for(let t=i.length;t>=0;t--){const s=i[t];u(s)||d(s)||i.splice(t,1)}i.length>0&&r.loadModules(["esri/layers/FeatureLayer","esri/layers/Layer","esri/portal/PortalItem"]).then((([t,s,e])=>{this.esriMap.layers.removeAll(),i.forEach((i=>{if(u(i)){const t=new e({id:i});s.fromPortalItem({portalItem:t}).then((t=>{this.esriMap.layers.add(t)})).catch((t=>{console.log(`Layer ${i} loading failed ${t.toString()}`)}))}else if(d(i)){const s=new t({url:i});s&&this.esriMap.layers.add(s)}}))}))}async createSearchWidget(t){const[i]=await r.loadModules(["esri/widgets/Search"]),s=new i({view:this.esriMapView});this.esriMapView.ui.add(s,{position:t,index:0}),this.searchWidget=s}async removeSearchWidget(){this.searchWidget&&(this.esriMapView.ui.remove(this.searchWidget),this.searchWidget=null)}async addGraphics(){this.esriMapView&&(0===this.symbol.indexOf("pin:")?this.showPin(this.symbol.substring(4)):this.symbol.length>0&&this.showSymbol(this.symbol))}updateGraphicSymbol(t){null!=this.symbolGraphic&&this.esriMapView.graphics.remove(this.symbolGraphic),this.symbolGraphic=t,this.esriMapView.graphics.add(t)}async showSymbol(t){const i=this.parsedOffset.x.toString(),s=this.parsedOffset.y.toString();let e;e=null==t.match(/https?:\/\//)?this.assetPath+t+".png":t;const[h,n,a]=await r.loadModules(["esri/symbols/PictureMarkerSymbol","esri/Graphic","esri/geometry/Point"]),o=new n({geometry:new a({longitude:this.longitude,latitude:this.latitude}),symbol:new h({url:e,width:"64px",height:"64px",xoffset:i,yoffset:s}),popupTemplate:{title:this.popuptitle,content:this.popupinfo}});this.updateGraphicSymbol(o)}async showPin(t){const[i,s,e]=await r.loadModules(["esri/symbols/TextSymbol","esri/Graphic","esri/geometry/Point"],this.esriMapOptions);let h=this.parsedOffset.x,n=this.parsedOffset.y;const a=new s({geometry:new e({longitude:this.longitude,latitude:this.latitude}),symbol:new i({color:t,haloColor:"black",haloSize:"1px",text:"",font:{size:30,family:"CalciteWebCoreIcons"},xoffset:h,yoffset:n}),popupTemplate:{title:this.popuptitle,content:this.popupinfo}});this.updateGraphicSymbol(a)}render(){return e("div",{key:"956ea553424f9064fec8976fc2e3b63b74b45090",class:"esri-map-view"})}constrainUI(t,i){let s;return w(t)?i||(this.esriMapView.ui.add(this.mapViewWidgets),this.esriMapView.constraints={},s=!1):(this.esriMapView.ui.remove(this.mapViewWidgets),this.esriMapView.constraints={minZoom:this.minZoom,maxZoom:this.maxZoom,geometry:this.esriMapView.extent},s=!0),s}verifyMapProps(){return!this.webmap||u(this.webmap)&&d(this.webmap)||(this.webmap=null),this.basemap||this.webmap||(this.basemap=this.defaultBasemap),!0}verifyViewpoint(){let t=!1;if(this.viewpoint||this.webmap||(this.viewpoint="0,0,2"),this.viewpoint){const i=o(this.viewpoint);this.longitude=i.longitude,this.latitude=i.latitude,this.levelOfDetail=i.levelOfDetail,this.parsedViewpoint=!0,t=!0}return t}verifySearch(){let t=!0;return this.search=this.search.toLocaleLowerCase(),this.search&&!p(this.search)?(this.search=null,t=!1):"off"==this.search&&(this.search=null),t}verifyMinMaxZoom(){const t=l(this.minmaxzoom,0,24);return this.minZoom=t.min,this.maxZoom=t.max,!0}verifyProps(){let t=!0;return t=this.verifyMapProps(),t=this.verifyViewpoint(),t=this.verifySearch(),t=this.verifyMinMaxZoom(),this.parsedOffset=c(this.symboloffset),t}static get assetsDirs(){return["assets"]}get hostElement(){return h(this)}static get watchers(){return{apikey:[{watchAPIKeyHandler:0}],basemap:[{watchBasemapHandler:0}],webmap:[{watchWebmapHandler:0}],viewpoint:[{watchViewPointHandler:0}],layers:[{watchLayersHandler:0}],search:[{watchSearchHandler:0}],symbol:[{watchSymbolHandler:0}],symboloffset:[{watchSymbolOffsetHandler:0}],popuptitle:[{watchPopupTitleHandler:0}],popupinfo:[{watchPopupInfoHandler:0}],ui:[{watchUIHandler:0}],minmaxzoom:[{watchMinMaxZoomHandler:0}]}}};m.style=".esri-map-view{height:100%;width:100%;padding:0;margin:0}";const f=class{watchAPIKeyHandler(t,i){t!=i&&(this.esriConfig.apiKey=t)}watchBasemapHandler(t,i){const s=this;s.viewChangePending||s.mapChangePending?s.mapLoadError.emit(new Error("Cannot change the map while a viewpoint change is in process.")):t!=i&&(s.mapChangePending=!0,s.updateEsriScene(t).then((()=>{s.basemap=t,s.mapChangePending=!1,s.mapLoaded.emit("loaded"),s.layers&&s.addLayers(s.layers)})).catch((t=>{s.mapChangePending=!1,s.mapLoadError.emit(t.toString())})))}watchWebSceneHandler(t,i){this.viewChangePending||this.mapChangePending?this.mapLoadError.emit(new Error("Cannot change the map while a viewpoint change is in process.")):t!=i&&(this.mapChangePending=!0,this.webscene=t,this.updateEsriWebScene(t).then((()=>{console.log("web scene change mapLoaded, new web scene should be showing"),this.esriSceneView&&this.esriWebScene&&(this.esriSceneView.map=this.esriWebScene),this.mapChangePending=!1,this.mapLoaded.emit("loaded"),this.layers&&this.addLayers(this.layers)})).catch((t=>{console.log(`web scene change, Map loading failed ${t.toString()}`),this.mapChangePending=!1,this.mapLoadError.emit(t.toString())})))}watchViewPointHandler(t,i){const s=this;if(s.viewChangePending||s.mapChangePending)s.mapLoadError.emit(new Error("Cannot change the viewpoint while a map change is in process."));else if(t!=i)if(s.parsedViewpoint=!1,s.viewpoint=t,s.verifyViewpoint()){if(null==s.esriSceneView)return;s.viewChangePending=!0,s.esriSceneView.goTo({center:[s.longitude,s.latitude],zoom:s.levelOfDetail}).then((function(){s.viewChangePending=!1,s.addGraphics()})).catch((function(){s.viewChangePending=!1,s.viewpoint=i,s.verifyViewpoint()}))}else s.viewpoint=i,s.verifyViewpoint()}watchCameraPositionHandler(t,i){const s=this;if(t!=i)if(s.cameraposition=t,s.verifyViewpoint()){if(null==s.esriSceneView)return;s.viewChangePending=!0,s.esriSceneView.goTo({center:[s.longitude,s.latitude],zoom:s.levelOfDetail}).then((function(){s.viewChangePending=!1})).catch((function(){s.viewChangePending=!1,s.cameraposition=i,s.verifyViewpoint()}))}else s.cameraposition=i,s.verifyViewpoint()}watchLayersHandler(t,i){t!=i&&(this.layers=t,this.addLayers(t))}watchSearchHandler(t,i){t!=i&&(this.removeSearchWidget(),this.search=t,this.verifySearch()&&this.createSearchWidget(this.search))}watchSymbolHandler(t,i){t!=i&&(this.symbol=t,this.addGraphics())}watchSymbolOffsetHandler(t,i){t!=i&&(this.symboloffset=t,this.parsedOffset=c(t),this.addGraphics())}watchPopupTitleHandler(t,i){t!=i&&(this.popuptitle=t,this.addGraphics())}watchPopupInfoHandler(t,i){t!=i&&(this.popupinfo=t,this.addGraphics())}watchUIHandler(t,i){t!=i&&this.constrainUI(t,!0)}watchMinMaxAltHandler(t,i){t!=i&&(this.minmaxalt=t,this.verifyMinMaxAltitude()||(this.minmaxalt=i,this.verifyMinMaxAltitude()))}constructor(e){t(this,e),this.mapLoaded=i(this,"mapLoaded"),this.mapLoadError=i(this,"mapLoadError"),this.ArcGISJavaScriptVersion="4.34",this.assetPath=s("./assets/"),this.sceneViewWidgets=["zoom","compass","navigation-toggle"],this.esriMap=null,this.esriWebScene=null,this.esriSceneView=null,this.symbolGraphic=null,this.searchWidget=null,this.longitude=0,this.latitude=0,this.levelOfDetail=2,this.minAltitude=0,this.maxAltitude=2e7,this.parsedViewpoint=!1,this.cameraSettings=null,this.defaultBasemap="arcgis-imagery-standard",this.viewChangePending=!1,this.mapChangePending=!1,this.esriMapOptions={url:`https://js.arcgis.com/${this.ArcGISJavaScriptVersion}/`,css:!0},this.apikey="YOUR_API_KEY",this.basemap="arcgis/imagery/standard",this.webscene="",this.viewpoint="",this.cameraposition="",this.layers="",this.search="",this.symbol="",this.symboloffset="",this.popuptitle="",this.popupinfo="",this.ui="",this.minmaxalt="",this.verifyProps(),r.setDefaultOptions(this.esriMapOptions),r.loadCss(`${this.esriMapOptions.url}/esri/css/main.css`),this.setAuthentication().then((()=>{this.createEsriScene().then((()=>{this.mapLoaded.emit("map-created")})).catch((t=>{console.log(`Map loading failed ${t.toString()}`),this.mapLoadError.emit(t.toString())}))})).catch((t=>{console.log(`Authentication failed ${t.toString()}`),this.mapLoadError.emit(t.toString())}))}componentDidLoad(){this.createEsriSceneView().then((()=>{this.mapLoaded.emit("view-created"),this.symbol&&this.addGraphics()}))}setAuthentication(){return new Promise(((t,i)=>{r.loadModules(["esri/config"]).then((([i])=>{this.esriConfig=i,this.apikey?this.esriConfig.apiKey=this.apikey:this.esriConfig.request.useIdentity=!0,t()})).catch((t=>{i(t)}))}))}async createEsriScene(){return new Promise(((t,i)=>{u(this.webscene)?this.updateEsriWebScene(this.webscene).then((()=>{t()})).catch((t=>{i(t)})):this.updateEsriScene(this.basemap).then((()=>{t()})).catch((t=>{i(t)}))}))}async updateEsriWebScene(t){return new Promise(((i,s)=>{r.loadModules(["esri/WebScene"]).then((([s])=>{this.esriWebScene=new s({portalItem:{id:t}}),i()})).catch((t=>{s(t)}))}))}async updateEsriScene(t){return new Promise(((i,s)=>{u(t)?r.loadModules(["esri/Map","esri/Basemap","esri/layers/VectorTileLayer"]).then((([s,e,h])=>{const n=new e({baseLayers:[new h({portalItem:{id:t}})]});this.esriMap?this.esriMap.basemap=n:this.esriMap=new s({basemap:n}),i()})).catch((t=>{s(t)})):r.loadModules(["esri/Map","esri/Basemap"]).then((([s,e])=>{const h=new e({style:{id:t,language:"en"}});this.esriMap?this.esriMap.basemap=h:this.esriMap=new s({basemap:h,ground:"world-elevation"}),i()})).catch((t=>{s(t)}))}))}async createEsriSceneView(){const[t]=await r.loadModules(["esri/views/SceneView"]),i=this.hostElement.querySelector("div");!this.webscene||this.cameraSettings||this.parsedViewpoint?this.cameraSettings?null==this.esriSceneView?this.esriSceneView=new t({container:i,map:this.esriMap||this.esriWebScene,camera:{position:{x:this.cameraSettings.x,y:this.cameraSettings.y,z:this.cameraSettings.z},heading:this.cameraSettings.heading,tilt:this.cameraSettings.tilt}}):this.esriSceneView.map=this.esriMap||this.esriWebScene:null==this.esriSceneView?this.esriSceneView=new t({container:i,zoom:this.levelOfDetail,center:[this.longitude,this.latitude],map:this.esriMap||this.esriWebScene}):this.esriSceneView.map=this.esriMap||this.esriWebScene:null==this.esriSceneView?this.esriSceneView=new t({container:i,map:this.esriWebScene}):this.esriSceneView.map=this.esriWebScene,this.esriSceneView&&(this.constrainUI(this.ui,!0),this.layers&&this.addLayers(this.layers),p(this.search)&&"off"!=this.search&&this.createSearchWidget(this.search))}addLayers(t){const i=t.split(",");for(let t=i.length;t>=0;t--){const s=i[t];u(s)||d(s)||i.splice(t,1)}i.length>0&&r.loadModules(["esri/layers/FeatureLayer","esri/layers/Layer","esri/portal/PortalItem"]).then((([t,s,e])=>{this.esriMap.layers.removeAll(),i.forEach((i=>{if(u(i)){const t=new e({id:i});s.fromPortalItem({portalItem:t}).then((t=>{this.esriMap.layers.add(t)})).catch((t=>{console.log(`Layer ${i} loading failed ${t.toString()}`)}))}else if(d(i)){const s=new t({url:i});s&&this.esriMap.layers.add(s)}}))}))}async createSearchWidget(t){const[i]=await r.loadModules(["esri/widgets/Search"]),s=new i({view:this.esriSceneView});this.esriSceneView.ui.add(s,{position:t,index:0}),this.searchWidget=s}async removeSearchWidget(){this.searchWidget&&(this.esriSceneView.ui.remove(this.searchWidget),this.searchWidget=null)}async addGraphics(){this.esriSceneView&&(0===this.symbol.indexOf("pin:")?this.showPin(this.symbol.substring(4)):this.symbol.length>0&&this.showSymbol(this.symbol))}updateGraphicSymbol(t){null!=this.symbolGraphic&&this.esriSceneView.graphics.remove(this.symbolGraphic),this.symbolGraphic=t,this.esriSceneView.graphics.add(t)}async showSymbol(t){const i=this.parsedOffset.x.toString(),s=this.parsedOffset.y.toString();let e;e=null==t.match(/https?:\/\//)?this.assetPath+t+".png":t;const[h,n,a]=await r.loadModules(["esri/symbols/PictureMarkerSymbol","esri/Graphic","esri/geometry/Point"],this.esriMapOptions),o=new n({geometry:new a({longitude:this.longitude,latitude:this.latitude}),symbol:new h({url:e,width:"64px",height:"64px",xoffset:i,yoffset:s}),popupTemplate:{title:this.popuptitle,content:this.popupinfo}});this.updateGraphicSymbol(o)}async showPin(t){const[i,s,e]=await r.loadModules(["esri/symbols/TextSymbol","esri/Graphic","esri/geometry/Point"]);let h=this.parsedOffset.x,n=this.parsedOffset.y;const a=new s({geometry:new e({longitude:this.longitude,latitude:this.latitude}),symbol:new i({color:t,haloColor:"black",haloSize:"2px",text:"",font:{size:30,family:"CalciteWebCoreIcons"},xoffset:h,yoffset:n}),popupTemplate:{title:this.popuptitle,content:this.popupinfo}});this.updateGraphicSymbol(a)}render(){return e("div",{key:"b7cfdfd6ae36cc201e6ca8a9d3ae2237743ef98e",class:"esri-scene-view"})}constrainUI(t,i){let s;return w(t)?i||(this.esriSceneView.ui.add(this.sceneViewWidgets),this.esriSceneView.constraints={},s=!1):(this.esriSceneView.ui.remove(this.sceneViewWidgets),this.esriSceneView.constraints={altitude:{min:this.minAltitude,max:this.maxAltitude}},s=!0),s}verifySceneProps(){return(this.webscene&&!u(this.webscene)||!d(this.webscene))&&(this.webscene=null),this.basemap||this.webscene||(this.basemap=this.defaultBasemap),!(!this.webscene&&!this.basemap)}verifyViewpoint(){if(this.cameraposition)this.cameraSettings=function(t){null==t&&(t="0,0,50000,90,0");let i=t.split(",");if(i.length<5){const t=[0,0,5e4,90,0];for(let s=i.length;s<5;s++)i[s]=t[s]}return{x:parseFloat(i[0])||0,y:parseFloat(i[1])||0,z:parseFloat(i[2])||5e4,heading:parseFloat(i[3])||90,tilt:parseFloat(i[4])||0}}(this.cameraposition),this.longitude=this.cameraSettings.x,this.latitude=this.cameraSettings.y;else if(this.viewpoint||this.webscene||(this.viewpoint="0,0,2"),this.viewpoint){const t=o(this.viewpoint);this.longitude=t.longitude,this.latitude=t.latitude,this.levelOfDetail=t.levelOfDetail,this.parsedViewpoint=!0}return!0}verifySearch(){let t=!0;return this.search=this.search.toLocaleLowerCase(),this.search&&!p(this.search)?(this.search=null,t=!1):"off"==this.search&&(this.search=null),t}verifyMinMaxAltitude(){const t=l(this.minmaxalt,0,2e7);return this.minAltitude=t.min,this.maxAltitude=t.max,!0}verifyProps(){let t=!0;return t=this.verifySceneProps(),t=this.verifyViewpoint(),t=this.verifySearch(),t=this.verifyMinMaxAltitude(),this.parsedOffset=c(this.symboloffset),t}static get assetsDirs(){return["assets"]}get hostElement(){return h(this)}static get watchers(){return{apikey:[{watchAPIKeyHandler:0}],basemap:[{watchBasemapHandler:0}],webscene:[{watchWebSceneHandler:0}],viewpoint:[{watchViewPointHandler:0}],cameraPosition:[{watchCameraPositionHandler:0}],layers:[{watchLayersHandler:0}],search:[{watchSearchHandler:0}],symbol:[{watchSymbolHandler:0}],symboloffset:[{watchSymbolOffsetHandler:0}],popuptitle:[{watchPopupTitleHandler:0}],popupinfo:[{watchPopupInfoHandler:0}],ui:[{watchUIHandler:0}],minmaxalt:[{watchMinMaxAltHandler:0}]}}};f.style=".esri-scene-view{height:100%;width:100%;padding:0;margin:0}";export{m as EsriMapView,f as EsriSceneView}