我如何根据实时 GPS 提要为 Bing 地图图钉制作动画
How Can I animate Bing map pushpins based on a live GPS feed
我查看了 bing 地图文档,试图找到我的问题的答案。我宁愿使用 bing 映射 api 做所有事情,如果可能的话不必添加第三方库。
问题:如何制作图钉动画以从一组 gps 坐标 (longitude/latitude) 平滑过渡到另一组以模拟平滑移动Bing 地图上的图钉?
问题: 从 map.entities 数组中删除整个对象是否会浪费足够的资源导致性能问题?如果是这样,如何在不删除整个对象的情况下更改图钉的纬度和经度属性?
在不从数组中删除对象的情况下尝试更改图钉属性的示例代码。此代码不起作用......我不确定它为什么不起作用?
map.entities.get(theIndexOfThePushPin)._location.latitude = newLat;
map.entities.get(theIndexOfThePushPin)._location.longitude = newLon;
我像这样创建图钉 - 这很好用
map.entities.push(new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(lat, lon), {
text: text,
visible: true,
textOffset: new Microsoft.Maps.Point(0, 5)
}));
我的递归 angular $http 调用的伪代码
function BusMoveGPSRefresh() {
$http.get(resourceURL)
.then(function (data) {
if ('if pushpins have not been created') {
//create pushpins...
}
} else {
//delete pushpins out of the array and then recreate them
//with updated lon/lat. Or just update existing objects lon/lat properties if possible?
}
}
BusMoveGPSRefresh();//after everything is done then go get more info and start again. recursion...
}, function (reason) {// if fail than do
console.log(reason);
console.log("This Is not Working!!! Dang!!");
});
}
任何对问题的见解将不胜感激!谢谢!
我找不到添加动画的简单答案。我确实找到了一个网站,该网站给出了关于如何为图钉制作动画的更多 in-depth 答案的分步教程。
答案:1 -- 关于如何动画化 bing 地图图钉的教程
https://blogs.bing.com/maps/2014/08/07/bring-your-maps-to-life-creating-animations-with-bing-maps-javascript/
答案:2 -- 这是更新图钉位置而不从实体数组中删除图钉对象的方法。
不要删除整个图钉对象,而是找到图钉索引,然后使用 属性 "setLocation()" 然后添加新位置。
//check to make sure that the lat and lon have
//changed if it is still the same location do nothing. else update
if (map.entities.get(indexOfPushpin).getLocation().latitude != lat
|| map.entities.get(indexOfPushpin).getLocation().longitude != lon) {
map.entities.get(indexOfPushpin).setLocation(new Microsoft.Maps.Location(lat, lon));
}
我查看了 bing 地图文档,试图找到我的问题的答案。我宁愿使用 bing 映射 api 做所有事情,如果可能的话不必添加第三方库。
问题:如何制作图钉动画以从一组 gps 坐标 (longitude/latitude) 平滑过渡到另一组以模拟平滑移动Bing 地图上的图钉?
问题: 从 map.entities 数组中删除整个对象是否会浪费足够的资源导致性能问题?如果是这样,如何在不删除整个对象的情况下更改图钉的纬度和经度属性?
在不从数组中删除对象的情况下尝试更改图钉属性的示例代码。此代码不起作用......我不确定它为什么不起作用?
map.entities.get(theIndexOfThePushPin)._location.latitude = newLat;
map.entities.get(theIndexOfThePushPin)._location.longitude = newLon;
我像这样创建图钉 - 这很好用
map.entities.push(new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(lat, lon), {
text: text,
visible: true,
textOffset: new Microsoft.Maps.Point(0, 5)
}));
我的递归 angular $http 调用的伪代码
function BusMoveGPSRefresh() {
$http.get(resourceURL)
.then(function (data) {
if ('if pushpins have not been created') {
//create pushpins...
}
} else {
//delete pushpins out of the array and then recreate them
//with updated lon/lat. Or just update existing objects lon/lat properties if possible?
}
}
BusMoveGPSRefresh();//after everything is done then go get more info and start again. recursion...
}, function (reason) {// if fail than do
console.log(reason);
console.log("This Is not Working!!! Dang!!");
});
}
任何对问题的见解将不胜感激!谢谢!
我找不到添加动画的简单答案。我确实找到了一个网站,该网站给出了关于如何为图钉制作动画的更多 in-depth 答案的分步教程。
答案:1 -- 关于如何动画化 bing 地图图钉的教程 https://blogs.bing.com/maps/2014/08/07/bring-your-maps-to-life-creating-animations-with-bing-maps-javascript/
答案:2 -- 这是更新图钉位置而不从实体数组中删除图钉对象的方法。
不要删除整个图钉对象,而是找到图钉索引,然后使用 属性 "setLocation()" 然后添加新位置。
//check to make sure that the lat and lon have
//changed if it is still the same location do nothing. else update
if (map.entities.get(indexOfPushpin).getLocation().latitude != lat
|| map.entities.get(indexOfPushpin).getLocation().longitude != lon) {
map.entities.get(indexOfPushpin).setLocation(new Microsoft.Maps.Location(lat, lon));
}