Google Maps & Ionic

ng-hangout #11

/ What can you do?

• Search

• Directions + Navigation

• Show map or layer

• Strew view

/ With Ionic

• Native SDK

• Web SDK

/ Demos with code

• Google Maps JS + Ionic en 5 pasos

• Google Maps Nativo con Ionic

• Trazando rutas con Google Maps JS + Ionic

• Background Geolocation

• Google Maps + Geocoder

• Múltiples markers en Google Maps

/ Native + Ionic

const mapOptions: GoogleMapOptions = {
  camera: {
    target: {
      lat: 43.0741904,
      lng: -89.3809802
    },
    zoom: 18,
    tilt: 30
  }
};

this.map = this.googleMaps.create(
    'map_canvas',
    mapOptions
);

/ Web + Ionic

// create a new map by passing HTMLElement
let mapEle: HTMLElement = document.getElementById('map');

// create LatLng object
let myLatLng = {lat: latitude, lng: longitude};

// create map
this.map = new google.maps.Map(mapEle, {
  center: myLatLng,
  zoom: 12
});

https://github.com/yannbf/may-the-4th

/ Questions?