如何根据实时GPS Feed为Bing地图图钉添加动画效果

时间:2016-01-14 15:39:00

标签: javascript angularjs gis bing-maps

我查看了bing maps文档,试图找到我的问题的答案。我宁愿使用bing maps api做所有事情,如果可能的话也不必添加第三方库。

问题:如何设置图钉的动画,以便从一组gps坐标(经度/纬度)平滑过渡到另一组gps坐标(经度/纬度),以便模拟Bing图上的图钉的平滑移动?< / p>

问题:可以从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)
}));

我的递归角$ 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!!");
                });
    }

对此问题的任何见解将不胜感激!谢谢!

1 个答案:

答案 0 :(得分:0)

我无法找到添加动画的简单答案。我找到了一个网站,提供了一个关于如何动画图钉的更深入的答案的分步教程。

答案:1 - 有关如何设置动画地图图钉动画的教程 https://blogs.bing.com/maps/2014/08/07/bring-your-maps-to-life-creating-animations-with-bing-maps-javascript/

答案:2 - 这是更新图钉位置而不删除实体数组中的图钉对象的方法。

不是删除整个图钉对象而是找到图钉索引,然后使用属性&#34; setLocation()&#34;然后添加一个新位置。

//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));
}