高德webjs 轨迹动态加点,并移动到该点上 autoRotation: true 不起作用
时间: 2024-04-20 14:24:46 浏览: 7
很抱歉,我之前的回答有误。在高德地图的Web API中,`autoRotation`属性只适用于Marker的旋转,而不是移动。对于移动到特定点上的效果,您可以使用`AMap.Map`对象的`setCenter`方法来实现。
以下是一个修改后的示例代码,用于实现轨迹动态加点,并移动到该点上的效果:
```javascript
var map = new AMap.Map('mapContainer', {
zoom: 13,
center: [lng, lat]
});
var polyline = new AMap.Polyline({
map: map,
strokeColor: '#3366FF',
strokeWeight: 4,
strokeOpacity: 1,
lineJoin: 'round'
});
var marker = new AMap.Marker({
map: map,
icon: 'https://webapi.amap.com/images/car.png',
offset: new AMap.Pixel(-26, -13)
});
function updatePosition(lng, lat) {
var path = polyline.getPath();
path.push(new AMap.LngLat(lng, lat));
polyline.setPath(path);
marker.setPosition(new AMap.LngLat(lng, lat));
map.setCenter(new AMap.LngLat(lng, lat));
}
// 示例数据,模拟轨迹点的更新
var points = [
[lng1, lat1],
[lng2, lat2],
[lng3, lat3],
// ...
];
var index = 0;
function moveToPoint() {
if (index < points.length) {
var point = points[index];
updatePosition(point[0], point[1]);
index++;
setTimeout(moveToPoint, 2000); // 每隔2秒移动到下一个点
}
}
moveToPoint();
```
请注意,示例中的`points`数组是一个模拟的轨迹点数组,您需要根据实际情况替换为您自己的数据。`moveToPoint`函数根据`points`数组中的点依次移动,并在移动到每个点时更新轨迹和地图中心点。
希望这次能帮到您!如果还有其他问题,请随时提问。