动画速度滑块不工作

Animation Speed Slider not Working

本文关键字：工作 速度 动画      更新时间：2024-01-10

我在谷歌地图中创建了一个应用程序，它显示了GPS跟踪的预览。预览将是在谷歌地图中绘制的GPS坐标，就像动画一样。

应用程序运行良好，但问题是，我有一个动画速度增加和减少滑块，它会在滑动时增加和减少动画速度，这在我的应用程序中无法正常工作。

有人能告诉我这个的一些解决方案吗

我的代码如下所示，带有Plunker

<div style="width: 880px;">
    200 <slider style="width:400px;" floor="200" ceiling="1000" step="1" ng-model="speedSlider"></slider>{{speedSlider}}
  <div id="map" style="width: 880px; height: 500px; float: left;"></div>
</div>

Plunker

if (!_.isEmpty(items)) {
        var timerId = getTimeInterval();
        function getTimeInterval() {
          return setInterval(function () {       
            route.getPath().push(new google.maps.LatLng(items[index].lat, items[index].lng));
            moveMarker(map, marker, items[index].lat, items[index].lng);
            markLAT = items[index].lat;
            markLNG = items[index].lng;
            index++;
            if (index == items.length) {
                clearInterval(timerId);
            }
          }, (1000 - $scope.speedSlider));
        }
        $scope.$watch('speedSlider', function(ssss) {
          clearInterval(timerId);
          timerId = getTimeInterval();
        });
      }

Plunker

相关文章：