Closed C0rporeus closed 3 years ago
The same problem. ` import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router';
import { SharedService } from '../shared/shared.service'; import { IUserLocation } from '../shared/shared.interface';
import as L from 'leaflet'; import as esri from 'esri-leaflet'; import * as esriGeo from 'esri-leaflet-geocoder';
@Component({ selector: 'app-app-where-to-see', templateUrl: './app-where-to-see.component.html', styleUrls: ['./app-where-to-see.component.css'] }) export class AppWhereToSeeComponent implements OnInit {
userLocation: IUserLocation;
constructor( private sharedService: SharedService, public activatedRoute: ActivatedRoute ) { }
ngOnInit() { const lMap = L.map('map', { maxZoom: 18, minZoom: 0 }).setView([0, 0], 15);
esri.basemapLayer('Topographic').addTo(lMap);
this.sharedService.currentLocation().subscribe((userLocation: IUserLocation) => {
this.userLocation = userLocation;
lMap.setView([this.userLocation.lat, this.userLocation.lng], 12);
L.esri.Geocoding.reverseGeocode()
.latlng([this.userLocation.lat, this.userLocation.lng])
.run((error, result, response) => {
console.log(result.address);
});
});
} } ` core.js: 7187 ERROR TypeError: Cannot read property 'Geocoding' of undefined
Also having this problem:
import * as L from 'leaflet'
import * as esri from 'esri-leaflet'
import * as esri_geo from 'esri-leaflet-geocoder'
var map = new L.Map('map', {maxZoom:21})
var searchControl = L.esri_geo.Geocoding.geosearch().addTo(map)
This throws the following error Cannot read property 'Geocoding' of undefined
// this means everything in the plugin is only going to be available via its own namespace
import * as esri_geo from 'esri-leaflet-geocoder';
// not L.esri.Geocoding.reverseGeocode()
esri_geo.reverseGeocode()
// not L.esri_geo.Geocoding.geosearch().addTo(map)
esri_geo.geosearch().addTo(map)
corrected on 5/9/2020
You are correct, I was forgetting how imports work, however I still get errors.
When using esri_geo.Geocoding.geosearch().addTo(map)
I now instead get Cannot read property 'geosearch' of undefined
.
reading this and https://github.com/Esri/esri-leaflet-geocoder/issues/100, it appears that including .Geocoding
is unnecessary too.
That works!
Thanks!
@C0rporeus @KroniK907 Is the original issue resolved here?
@Gavinr For me this issue is resolved, although including how to use this when implemented in a JS framework as a node module would be nice, since how to do that is not clear from the existing documentation.
We always welcome pull requests, particularly for useful documentation updates, @C0rporeus @KroniK907, @studio-salamander. Perhaps we can start out with a README update?
@jgravois thanks brother is works on vuejs, .Geocoding is unnecessary
@aacassandra .... hi brother can u please help me with this in vuejs ...
I'm marking this as "FAQ" and will close it for general reference, but please note my comment just above.
https://github.com/Esri/esri-leaflet-geocoder/issues/219#issuecomment-567561335
We really do welcome README suggestions and improvements (pull requests are welcome!) from the community since you all more frequently see this library used in different environments and frameworks. Thanks.
esri_geo.geosearch().addTo(map
This is the Correct answer
esri-leaflet-geocoder getting error while imprting import * as esri_geo from 'esri-leaflet-geocoder';
when i use library in Angular 8, this happens:
core.js:9110 ERROR TypeError: Cannot read property 'Geocoding' of undefined
apparently there would be a correct method to work in angular, what I did was invoke the library from the scripts defined in angular.json.