map.setCenter undefined - google-maps

Question

I'm using GoogleMaps and want to centre it when the orientation changes, but when I call
map.setCenter({...})
I'm receiving an undefined error for setCenter.
Here's my code:
let GoogleMap = {
lat : "",
lng : "",
map : {},
marker : {},
point : {},
init() {
return this
},
create(lat, lng) {
this.lat = lat
this.lng = lng
this.point = {lat: lat,lng: lng};
this.map = new google.maps.Map(document.getElementById('map'), {
center: this.point,
zoom: 17
});
this.marker = new google.maps.Marker({
map: this.map,
position: this.point
});
window.addEventListener('orientationchange', this.doOnOrientationChange);
},
doOnOrientationChange() {
this.map.setCenter({lat: this.lat, lng: this.lng})
}
}
export default GoogleMap
Docs: https://developers.google.com/maps/documentation/javascript/reference#Map
And I grab the google maps api from: https://maps.googleapis.com/maps/api/js?key=KEY&libraries=geometry,places
Any ideas?

Answer 1

Thanks to geocodezip, the issue was scoping, and this wasn't in the correct scope in the orientation event handler.
The fix was to use the bind method
window.addEventListener('orientationchange', this.orientationChange.bind(this));
Full working code:
let GoogleMap = {
lat : "",
lng : "",
map : {},
marker : {},
point : {},
init() {
return this
},
create(lat, lng) {
this.lat = lat
this.lng = lng
this.point = {lat: lat,lng: lng};
this.map = new google.maps.Map(document.getElementById('map'), {
center: this.point,
zoom: 17
});
this.marker = new google.maps.Marker({
map: this.map,
position: this.point
});
window.addEventListener('orientationchange', this.orientationChange.bind(this));
},
orientationChange() {
this.map.setCenter({lat: this.lat, lng: this.lng})
}
}
export default GoogleMap
The map now centres itself as expected when the orientation changes.