0

hice correr en el navegador y funciona el codigo del siguiente link: http://tphangout.com/ionic-3-leaflet-maps-geolocation-markers/

Sin embargo al instalar en el dispositivo me sale el siguiente error:

"geolocation error timeout expired" Sabe alguien porque ocurre esto?

1 respuesta 1

0

Lo pude resolver, se debe hacer tal cual el link que publique ANTERIORMENTE y cambiar el codigo:

import { Component, ViewChild, ElementRef } from '@angular/core';
import { NavController } from 'ionic-angular';
import leaflet from 'leaflet';
import 'leaflet-routing-machine';

@Component({
  selector: 'page-mapas',
  templateUrl: 'mapas.html'
})
export class MapasPage {

  @ViewChild('map') mapContainer: ElementRef;
  map: any;

 constructor(public navCtrl: NavController) {

 }

 ionViewDidEnter() {
   this.loadmap();
 }

 loadmap() {
    this.map = leaflet.map("map").fitWorld();
    leaflet.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
      // attributions: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
      maxZoom: 18
    }).addTo(this.map);
    this.map.locate({
      setView: true,
      maxZoom: 10,
      timeout: 30000
    }).on('locationfound', (e) => {
      console.log(e.latitude,e.longitude)
      leaflet.Routing.control({
        waypoints: [
          leaflet.latLng(e.latitude, e.longitude),
          leaflet.latLng(-16.4854728,-68.1983184)
        ], routeWhileDragging:true
      }).addTo(this.map)
    }).on('locationerror', (err) => {
      alert(err.message);
    })
  }
}

Y en el index html colocar este codigo de css:

<link href="https://unpkg.com/[email protected]/dist/leaflet.css" rel="stylesheet">
  <link rel="stylesheet" href="https://unpkg.com/leaflet-routing-machine@lates/dist/leaflet-routing-machine.css" />

SALUDOS ESPERO LE SIRVA A OTRA GENTE

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.