I want to find nearby location

@flycoders_sourav wrote:

Hi Guys,
I want to do that.when user click on a button then going to the next page and showing the near by location to the user.but i’m try like this but not working properly.

Home.html

<ion-content padding>
  <button (click)="bank($event)" id="bank" value="bank" ion-button color="secondary">Hospital</button>
</ion-content>

Home.ts

bank(event) {

  this.isType = event.target.value;
  alert(this.isType);


	this.navCtrl.push(MapPage,{
         isType:this.isType
  })
}

Below my map.html

<ion-content padding>
  <div #map id="map"></div>
</ion-content>

map.ts

export class MapPage {

  @ViewChild('map')
  mapElement: ElementRef;

  map:any;
  latLng:any;
  markers:any;
  mapOptions:any;

  isKM:any=500;
  isType:any="";

  constructor(public navCtrl: NavController,private ngZone: NgZone, private geolocation : Geolocation,public navParams: NavParams) {

            this.isType= navParams.get('isType');
  }

  ionViewDidLoad() {
    this.loadMap()
  }
ionViewWillEnter(){
 //this.nearbyPlace();
}
  loadMap(){
    this.geolocation.getCurrentPosition().then((position) => {
      this.latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
     //alert(this.latLng)
      this.mapOptions = {
        center: this.latLng,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      this.map = new google.maps.Map(this.mapElement.nativeElement, this.mapOptions);
      //this.nearbyPlace();
      this.showMyLocation();
      this.nearbyPlace();
    }, (err) => {
      alert('err '+err);
    });
  }
  showMyLocation(){
    let marker = new google.maps.Marker({
        map: this.map,
        animation: google.maps.Animation.DROP,
        position: this.map.getCenter()
    });
    let markerInfo = "<h4>You are here!</h4>";

    let infoModal = new google.maps.InfoWindow({
        content: markerInfo
    });

    google.maps.event.addListener(marker, 'click', () => {
        infoModal.open(this.map, marker);
    });
}
 /*-----------------Find Nearby Place------------------------*/
nearbyPlace() {

  //alert(this.LatLng)
    alert(this.isKM);
    alert(this.isType);
    this.loadMap();
    this.markers = [];
    let service = new google.maps.places.PlacesService(this.map);
    service.nearbySearch({
              location: this.latLng,
              radius: this.isKM,
              types: [this.isType]
            }, (results, status) => {
                this.callback(results, status);
            });
  }
  callback(results, status) {
    if (status === google.maps.places.PlacesServiceStatus.OK) {
      for (var i = 0; i < results.length; i++) {
        this.createMarker(results[i]);
      }
    }
  }
  createMarker(place){
    var placeLoc = place;
    console.log('placeLoc',placeLoc)
    this.markers = new google.maps.Marker({
        map: this.map,
        position: place.geometry.location
    });

    let infowindow = new google.maps.InfoWindow();

    google.maps.event.addListener(this.markers, 'click', () => {
      this.ngZone.run(() => {
        infowindow.setContent(place.name);
        infowindow.open(this.map, this.markers);
      });
    });
  }



}

just showing the current location. not showing nearby location. how can i fix.please helpme anyone .

Posts: 1

Participants: 1

Read full topic