Question

loadMap(){

    this.geolocation.getCurrentPosition().then((position) => {
      let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
      let mapOptions = {
        center: latLng,
        position: latLng,
        zoom: 15,

        mapTypeId: google.maps.MapTypeId.ROADMAP
      }

      this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
      this.addMarker();

    }, (err) => {
      console.log(err);
    });
  }

  startTracking() {

    this.isTracking = true;
    this.trackedRoute = [];
 
    this.positionSubscription = this.geolocation.watchPosition()
      .pipe(
        filter((p) => p.coords !== undefined) //Filter Out Errors
      ).subscribe(data => {
        setTimeout(() => {
          this.trackedRoute.push({ lat: data.coords.latitude, lng: data.coords.longitude });
          this.redrawPath(this.trackedRoute);
        }, 0);
      });
  }
 
  redrawPath(path) {
    if (this.currentMapTrack) {
      this.currentMapTrack.setMap(null);
    }
 
    if (path.length > 1) {
      this.currentMapTrack = new google.maps.Polyline({
        path: path,
        geodesic: true,
        strokeColor: '#ff00ff',
        strokeOpacity: 1.0,
        strokeWeight: 3
      });
      this.currentMapTrack.setMap(this.map);
    }
  }

  <div #map id="map"></div>

我正在使用Ionic 3中的一个应用程序，该应用程序显示了地图中的当前位置以及单击开始跟踪按钮，我们必须在经纬度之间添加折线。我知道有一些绘制折线的方法，我的想法是提取将标记的纬度较长的坐标保存在数组中，然后将其设置为绘制折线的“路径”，但我在地图上未绘制折线时遇到了问题。检查我们的以下代码：

ionic3中的折线不在地图上绘制吗？

0 个答案: