如何使用Here Map JS绘制车辆图标移动动画以及传递的坐标

<script src="https://js.api.here.com/v3/3.1/mapsjs-core.js"></script>
<script src="https://js.api.here.com/v3/3.1/mapsjs-service.js"></script>
<script src="https://js.api.here.com/v3/3.1/mapsjs-mapevents.js"></script>

<div id="mapContainer" style="width: 100%; height: 400px;"></div>

var platform = new H.service.Platform({
  apikey: 'YOUR_API_KEY'
});

var defaultLayers = platform.createDefaultLayers();

var map = new H.Map(
  document.getElementById('mapContainer'),
  defaultLayers.vector.normal.map,
  {
    center: { lat: 52.5, lng: 13.4 },
    zoom: 10
  }
);

var icon = new H.map.Icon('car.png', {
  size: { w: 32, h: 32 }
});

var marker = new H.map.Marker({ lat: 52.5, lng: 13.4 }, { icon: icon });
map.addObject(marker);

function moveMarker(marker, coordinates) {
  var start = marker.getPosition();
  var end = new H.geo.Point(coordinates.lat, coordinates.lng);
  var duration = 2000; // 动画持续时间（毫秒）

  var lineString = new H.geo.LineString([start, end]);
  var polyline = new H.map.Polyline(lineString, { style: { lineWidth: 4 } });
  map.addObject(polyline);

  var startTime = new Date().getTime();
  var endTime = startTime + duration;
  var step = 16; // 动画更新间隔时间（毫秒）

  function animate() {
    var now = new Date().getTime();
    var progress = Math.min((now - startTime) / duration, 1);
    var point = lineString.extractPoint(progress);
    marker.setPosition(point);

    if (now < endTime) {
      requestAnimationFrame(animate);
    } else {
      map.removeObject(polyline);
    }
  }

  animate();
}

marker.addEventListener('tap', function() {
  moveMarker(marker, { lat: 52.6, lng: 13.5 }); // 设置新的坐标
});