マップのリーフレットで5秒ごとにマーカを移動

Question

5秒ごとにマップ上のマーカを移動したいのですが、今は自分のコードがデバッグモードで動作しています。つまり、私はマーカの移動を見ることができます。デバッグモード、私はデバッグモードのマーカーから切り替えるたびに最後の緯度の長いポイント、つまり目的地に直接到達しています。

コントローラコード：

app 
    .controller('AboutCtrl', function ($scope,$http,leafletData,$timeout) { 
$scope.markers = []; 
    var iss; 
    angular.extend($scope, { 
     osloCenter: { 
     } 
    }); 
    function updatePoints(){ 
     $http.get('views/newdata.json').success(function(response) { 
     leafletData.getMap('mymap').then(function(map) { 

      for(var i = 0; i < response.length; i++){ 
      var latitude = response[i].lat 
      var longitude = response[i].lng 

      if (!iss) { 
       iss = L.marker([latitude,longitude]).bindPopup("Vehicle is Here").addTo(map); 
      } 
      iss.setLatLng([latitude,longitude]).update(); 

      setTimeout(updatePoints, 5000); 

      } 
     }); 
     }); 
    } 
    updatePoints(); 
    angular.extend($scope, { 
     osloCenter: { 
      lat: 12.98254, 
      lng: 77.59258, 
      zoom: 5 
     }, 
     markers: { 

     }, 
     defaults: { 
      scrollWheelZoom: false 
     } 
     }); 
    }); 

HTML：

<div> 
    <leaflet id="mymap" lf-center="osloCenter" markers="markers" width="100%" height="480px"></leaflet> 
</div> 

JSONファイル：

[{ 
    "lat": 12.98254, 
    "lng": 77.59258, 
    "message": "T1" 
} 
,{ 
    "lat": 12.9829556, 
    "lng": 77.59232369999999, 
    "message": "T1" 
    }, 
    { 
    "lat": 12.98667086, 
    "lng": 77.58870730000001, 
    "message": "T1" 
    }, 
    { 
    "lat": 13.0322459, 
    "lng": 77.53386159999999, 
    "message": "T1" 
    }, 
    { 
    "lat": 13.0322459, 
    "lng": 77.533861599999999, 
    "message": "T1" 
    }, 
    { 
    "lat": 15.3165803, 
    "lng": 75.143377, 
    "message": "T1" 
    }, 
    { 
    "lat" : 18.6621962, 
    "lng" : 73.7283022 

    }, 
    { 
    "lat" : 18.6621962, 
    "lng" : 73.7283022 

    }, 
    { 

    "lat" : 19.0303032, 
    "lng" : 73.0887804 

    }, 
    { 

    "lat" : 19.068712, 
    "lng" : 72.90422909999999 

    } 
] 

Answer 1

おそらくcurlpit：

setTimeout(updatePoints, 5000); 

交換することによって：angularJSはサイクルがでキックでダイジェストを確認します

$timeout(updatePoints, 5000); 

[OK]を

Answer 2

、私はもう少し慎重にあなたのコードを読んだ後。タイムアウトは、部分的な問題ですが、例えば、次のように、次のように何か他のために変更する必要があります。

function updatePoints(i){ 
    $http.get('views/newdata.json').success(function(response) { 
    leafletData.getMap('mymap').then(function(map) { 
     i = i || 0; //set default 

     var latitude = response[i].lat 
     var longitude = response[i].lng 

     if (!iss) { 
     iss = L.marker([latitude,longitude]).bindPopup("Vehicle is Here").addTo(map); 
     } 
     iss.setLatLng([latitude,longitude]).update(); 

     if (i<response.length) { 
     $timeout(function() {updatePoints(i+1)}, 5000); 
     } 

    }); 
    }); 
} 

この方法では、単一のウェイポイントは全体ではなく、アレイ、一度に処理されます。