Google Direction service plotting unexpected route

Question

I have an asset i.e. a truck generating reads (lat, lng) at a specific interval and I am plotting those reads on maps using direction service api

But direction service is returning path which is not at all correct.

Highlighted area is a car parking and a truck can't go inside that.

Code provided below:

displayRoute(){
    var path = new this.google.maps.MVCArray();
    var service = new this.google.maps.DirectionsService();
    var markers = this.state.markers;

    var wayPoints = [];

    if (markers.length >= 2) {
      this.isContinueRouting = true;

      for (var k = 0, parts = [], max = this.maxWayPointLimit - 1; k < markers.length; k = k + max){
        parts.push(markers.slice(k, k + max + 1));
      }

      var TempParts = [].slice.call(parts);
      var delayFactor = 0;
      var continueRouting = () => {
        if(this.isContinueRouting) {
          if (!TempParts || TempParts.length === 0) {
            this.refreshMap();
            return;
          }
          var firstPart = TempParts[0];
          TempParts = TempParts.slice(1);
          wayPoints = [];
          for (var j = 1; j < firstPart.length - 1; j++) {
            wayPoints.push({location: firstPart[j].latLng, stopover: false});
          }
          var getDirectionRoute = (objRequest) => {
            service.route(objRequest, (result, status) => {
              if (status === this.google.maps.DirectionsStatus.OK) {
                var renderer = new this.google.maps.DirectionsRenderer({
                  suppressMarkers: true,
                  polylineOptions:{strokeColor: '#4986E7', icons:[{icon:{path:this.google.maps.SymbolPath.FORWARD_CLOSED_ARROW}}]}
                });
                var gRenderers = this.state.gRenderers;
                if(!gRenderers){
                  gRenderers = [];
                }
                gRenderers.push(renderer);
                this.setState({
                  gRenderers: gRenderers
                });
                renderer.setMap(this.map);
                renderer.setDirections(result);
                continueRouting();
              }
              else if (status === this.google.maps.DirectionsStatus.OVER_QUERY_LIMIT) {
                delayFactor++;
                setTimeout(() => {
                  getDirectionRoute(objRequest);
                }, delayFactor * 1000);
              }
              else {
                console.log("Route: " + status);
              }
            });
          };
          getDirectionRoute({
            origin: firstPart[0].latLng,
            destination: firstPart[firstPart.length - 1].latLng,
            waypoints: wayPoints,
            optimizeWaypoints: false,
            travelMode: this.google.maps.DirectionsTravelMode.DRIVING
          });
        }
      }
      continueRouting();
    }
    else{
      this.refreshMap();
    }
  }

I am providing lat lng details below as well, separated by |

'31.7041718,-106.2919151|31.7041718,-106.2919151|31.7032561,-106.2934446|31.7076082,-106.2920445|31.6872383,-106.2983887|31.6135476,-106.2551746|31.6160641,-106.2541132|31.6185915,-106.2564508|31.6366903,-106.2750925|31.7042845,-106.2951952|31.7043367,-106.2925862|31.7025645,-106.2905912|31.7815772,-106.4109026|31.792458,-106.5084194|31.8825601,-106.5835285|31.8610442,-106.6844508|31.8685025,-106.7015895|31.8725584,-106.6778204|31.8025682,-106.5208837|31.7450037,-106.3330166|31.7037371,-106.2927402|31.7020747,-106.2912236|31.6605857,-106.2750073|31.6211992,-106.2589605|31.6146543,-106.2533209|31.7194213,-106.3032185|31.7039523,-106.2928624|31.702484,-106.2902215|31.7043125,-106.2952218|31.777505,-106.4241939|31.8764563,-106.5801106|31.7928081,-106.6849148|31.7890649,-106.6837816|31.8092266,-106.6847083|31.8576709,-106.5757679|31.7814772,-106.4071658|31.7040939,-106.2929278|31.7036424,-106.292041|31.7036424,-106.292041|31.7021739,-106.2920716|31.7021681,-106.292032|31.7021681,-106.292032|31.7021681,-106.292032|31.7021681,-106.292032|31.7021681,-106.292032|31.7021681,-106.292032|31.7021681,-106.292032|31.7021681,-106.292032'

I even tried implementing snap to road but that causes other issues as all reads are not near to each other.

Not sure what is the issue here.

Answer 1

I don't think you can use the Directions API to visualise historical routes. Given the start end end coordinates and the waypoints between, the API tries to PLAN and suggest a route for you to take LATER.

I think the only solution would be to fix the problems the Snap to Roads API and use that. If the results are too erratic, then maybe you should set the GPS transponders to report their coordinates more often, if possible.