1

Estoy tratando de crear una app en ionic 4 en la cual se navegue con ion tabs. El problema está en que debo mostrar un mapa dentro del ion tab y ni siquiera me toma las coordenadas. Estoy usando el api en javascript de google. La app compila bien pero no muestra el mapa, ya cambié las dimensiones del css pero aun así no muestra nada.

Código ts del tab 1:

import { Component, OnInit } from '@angular/core';
import { Geolocation ,GeolocationOptions ,Geoposition ,PositionError } from '@ionic-native/geolocation/ngx';

declare  var google;

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

  constructor(

       private geolocation: Geolocation

  ) { }


  ngOnInit() {
  }
  async loadmap(){

   const respuesta = await this.geolocation.getCurrentPosition();

    const myLatLng = {
     lat: respuesta.coords.latitude,
     lng: respuesta.coords.longitude
    }; 
    console.log(myLatLng);
    const mapEle: HTMLElement = document.getElementById('mapa');
    // create map
      const map = new google.maps.Map(mapEle, {
      center: myLatLng,
      zoom: 12
    });

  }
}
2
  • Verifica que en tus estilos le estes dando el ancho y alto adecuado a tu mapa. Commented el 7 may. 2019 a las 13:05
  • Bienvenido a Stack Overflow en español! Mira Cómo preguntar para que tu pregunta sea mejor recibida. También, aprovecha y haz el recorrido de bienvenida para entender mejor cómo funcionamos y de paso obtener tu primera medalla!
    – gbianchi
    Commented el 7 may. 2019 a las 14:23

1 respuesta 1

1

No se podia observar el mapa debido a que el id de la etiqueta div que se usa en el page.html no era el mismo, por otro lado al utilizar elgetelemenbyid tambien estaba distinto

1
  • 2
    Podrias mirar Cómo responder? tu respuesta se reporto como de baja calidad, ya que no se entiende bien cual fue el problema y cual es la solucion.
    – gbianchi
    Commented el 7 may. 2019 a las 14:23

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.