Track a user draw polyline snap to roads bing maps

问题

Was wondering if anyone has any experience or could help with the logic, to track a user (car) with Bing maps

As the user travels a line should be drawn of their journey, but snap to roads, the way I have things set at the moment, lines will be drawn through buildings.

Because whenever there is an update to the position, 2 points are calculated and a line is added to the map

(At the moment am using watchPosition but in future will get position every 30 seconds)

  watchPos() {
    let options = { timeout: 60000 }
    this.watchId = navigator.geolocation.watchPosition((position) => {
      this.lat = position.coords.latitude;
      this.lng = position.coords.longitude;
      this.setMap()
      console.log(this.lat, this.lng)
    }, this.errorHandler, options);

  }
  setMap() {
    this.loc = new Microsoft.Maps.Location(this.lat, this.lng);
    if (!this.initialised) {
      this.oldLoc = this.loc;
      this.initialised = true
      this.map = new Microsoft.Maps.Map(this.driveMap.nativeElement, {
        credentials: CONFIG.BING_API_KEY,
        center: this.loc,
        mapTypeId: Microsoft.Maps.MapTypeId.road,
        navigationBarMode: 2,
        zoom: this.zoom
      });
      this.user = new Microsoft.Maps.Pushpin(this.loc, { icon: '../images/icon.svg' });
      this.map.entities.push(this.user);
      // console.log(loc)
    } else {
      // Draw line
      // from this.oldLoc to this.loc
      let lineVertices = new Array(this.oldLoc, this.loc);
      let line = new Microsoft.Maps.Polyline(lineVertices);
      // Then set oldLoc to new loc
      this.oldLoc = this.loc
      this.map.entities.push(line);
      this.map.setView({
        center: this.loc
      });
      this.user.setLocation(this.loc);
    }
  }

回答1:

Bing Maps has a snap to road API coming out near the end of next week which is specifically designed for this. You pass in your GPS coordinates and it will snap it to the roads, additionally, if you pass in an array of points you can also have it return a logical path that passes through the snapped points. Watch the Bing Maps blog for the announcement: https://blogs.bing.com/maps

来源：https://stackoverflow.com/questions/47419002/track-a-user-draw-polyline-snap-to-roads-bing-maps

标签

javascript

bing-maps