Hey guys I'm using Ionic Native Google Maps plugins and I'm trying to show all the points on the screen as well as the user location, I can do that, no problem, the issue is that I need the user's location to be centered in the map AND show all the points around him.
I've been trying to use the put all my points into a new LatLngBounds
and setting each using the .extend()
method but it's not working.
Please help
async expandRadius() {
const query = await this.queryPlaces(10);
get(query).then(nearByPlaces => {
const foundPlaces = [];
nearByPlaces.forEach( el => {
const placesData = {
distance: Math.floor(this.geo.point(this.centerPoint.latitude, this.centerPoint.longitude)
.distance(el.geolocation.geopoint.latitude, el.geolocation.geopoint.longitude)),
...el
};
foundPlaces.push(placesData);
// THE CENTER ISSUE STARTS HERE //
const tmp = new LatLng(el.geolocation.geopoint.latitude, el.geolocation.geopoint.longitude);
this.bounds.extend(tmp);
this.map.addMarkerSync({
position: {
lat: tmp.lat,
lng: tmp.lng
},
icon: {
url: 'www/assets/icon/pin.png',
size: {width: 23, height: 33},
}
});
});
this.map.moveCamera({
target: this.bounds.getCenter(),
tilt: 0,
});
})
.catch()
.finally( async () => await this.loading.dismiss() );
}