topic Re: Cannot read property of undefined error when trying to use esri/geometry/support/webMercatorUtils in Angular in ArcGIS JavaScript Maps SDK Questions

Cannot read property of undefined error when trying to use esri/geometry/support/webMercatorUtils in Angular

PeteVitt — Tue, 16 Feb 2021 23:02:39 GMT

Hi I'm using Javascript api 4.X with Angular and am getting the subject error when I try to call the xyToLngLat method on webMercatorUtils. I'm using the esri-loader to load esri modules.

In the code below the PanMap method in the Map Component gets called from Component MtTicketListComponent. Any ideas where I'm going wrong?

Thanks

Pete

Component 1
export class MtTicketListComponent implements OnInit {
....
public mtMap:MtMapComponent = new MtMapComponent;
...
MarkTicket(ticketData:UnMarkedData) {
this.mtMap.PanMap(ticketData.ptCenterX, ticketData.ptCenterY);
}
}
Map Component
export class MtMapComponent implements OnInit {
...
utilsMerc: __esri.webMercatorUtils

ngOnInit(): void {
loadModules([
'esri/Map',
'esri/views/MapView',
'esri/geometry/support/webMercatorUtils'
])
.then(([EsriMap, EsriMapView, EsriwebMercatorUtils]) => {
this.utilsMerc = new EsriwebMercatorUtils;
...
...
})
...
}
public PanMap(x: number, y: number) {
let coordinates: any = this.utilsMerc.xyToLngLat(x,y);//getting undefined error on this.utilsMerc
..

}

Re: Cannot read property of undefined error when trying to use esri/geometry/support/webMercatorUtils in Angular

JohnGrayson — Wed, 17 Feb 2021 16:30:00 GMT

The help doc says that webMercatorUtils is an Object not a Class, so I don't think we would create a new instance using the 'new' keyword. I wonder if this would work in your code:

let coordinates: any = EsriwebMercatorUtils.xyToLngLat(x,y);

Re: Cannot read property of undefined error when trying to use esri/geometry/support/webMercatorUtils in Angular

PeteVitt — Wed, 17 Feb 2021 16:53:38 GMT

Hi John - I've tried that with no luck. I think my problem is related to this issue (https://github.com/Esri/angular-cli-esri-map/issues/8) discussed over on Github in 2018 about not being able to access the esri typescript namespace outside of the ngOnInit function. I've put in another issue over there to see if there have been an developments

Thanks

Pete