import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
import { WpServiceService } from '../wp-service.service';
import { Geolocation } from '@ionic-native/geolocation/ngx';
import { NativeGeocoder, NativeGeocoderResult, NativeGeocoderOptions } from '@ionic-native/native-geocoder/ngx';

declare var google: any;


@Component({
  selector: 'app-nearme',
  templateUrl: './nearme.page.html',
  styleUrls: ['./nearme.page.scss'],
})
export class NearmePage implements OnInit {

  @ViewChild('nearmap', { static: true }) mapRef: ElementRef;  

  nearmap: any;
  placenear: any = [];

  constructor(private wpservice: WpServiceService, private geolocation: Geolocation) { }

  ngOnInit() {
     
    this.showMap();
    //console.log(this.mapRef.nativeElement);  
    this.wpservice.getNear().subscribe((placeneardata) => {
      this.placenear = placeneardata;
      console.log('load Near Place');
      console.log(placeneardata);
    });

  }

  showMap() {
    let location = new google.maps.LatLng(13.7643439, 100.6899729);
    let options = {
      center: location,
      zoom: 15,
      disableDefaultUI: true
    }
    this.nearmap = new google.maps.Map(this.mapRef.nativeElement, options);
  }
  
}
