Javascript 使用Firebase更新google地图上的特定标记

Javascript 使用Firebase更新google地图上的特定标记,javascript,google-maps,firebase,firebase-realtime-database,google-maps-markers,Javascript,Google Maps,Firebase,Firebase Realtime Database,Google Maps Markers,我在我的网站上使用谷歌地图,基本上我要做的是在地图上显示标记,我从Firebase检索驱动程序的对象,然后检索每个驱动程序的纬度和经度,并将其显示在地图上。 所以我有两个问题: 1-每当每个司机的纬度和经度发生变化时,我想更新他们在地图上的标记,而不是所有的标记,只是那些纬度和经度发生变化的司机的标记,我怎么做 2-我知道Firebase中的child\u changed会返回已更改的子项的快照,但如果同时更改100个子项,它会一次返回所有100个子项吗 以下是我的一些代码示例: 此函数返回所

我在我的网站上使用谷歌地图,基本上我要做的是在地图上显示标记,我从Firebase检索
驱动程序的对象,然后检索每个
驱动程序的纬度和经度,并将其显示在地图上。
所以我有两个问题:

1-每当每个
司机的纬度和经度发生变化时,我想更新他们在地图上的标记,而不是所有的标记,只是那些纬度和经度发生变化的司机的标记,我怎么做

2-我知道Firebase中的
child\u changed
会返回已更改的子项的快照,但如果同时更改100个子项,它会一次返回所有100个子项吗


以下是我的一些代码示例:

此函数返回所有
驱动程序
,并将其显示为地图上的标记

    function getDrivers(){

     var database = firebase.database().ref().child('allDrivers');
     database.on('value',function(snapshot) {
        var array = [];
        snapshot.forEach(function(childSnapshot) {
          var childKey = childSnapshot.key;
          var childData = childSnapshot.val();
          array.push(childData);
        });
        for (var i = 0; i < array.length; i++) {
         var latlng = {lat: parseFloat(array[i].latPosition), lng: parseFloat(array[i].longPosition)};
         var marker = new google.maps.Marker({
           position: latlng,
           map: map,
           animation: google.maps.Animation.DROP,
           icon:'img/goodambulance.jpg'
         });    }  });
函数getDrivers(){ var database=firebase.database().ref().child('allDrivers'); 数据库.on('value',函数(快照){ var数组=[]; snapshot.forEach(函数(childSnapshot){ var childKey=childSnapshot.key; var childData=childSnapshot.val(); array.push(childData); }); 对于(var i=0;i
这不是最佳做法,因为一旦子项更改,它将返回
allDrivers
节点中的所有子项,我只希望它返回更改的子项,然后更新其在地图上的位置。
那么我应该在代码中做些什么更改呢?

我使用了
子事件监听器而不是
,我创建了两个对象,相当于
hashMap
,它接受一个键和一个值 一个用于
驱动程序
对象,一个用于标记

var driversMap = {};
var markersMap = {};
在添加的
child\u中
我将
驱动程序
对象和从
快照
中检索到的与之相关联的唯一键放入
驱动程序映射

driversMap[childKey] = childData;
然后我检索纬度和经度并添加标记。 我还使用
id

var latlng = {lat:parseFloat(driversMap[childKey].latPosition), lng: parseFloat(driversMap[childKey].longPosition)};

    var marker = new google.maps.Marker({
      position: latlng,
      map: map,
      animation: google.maps.Animation.DROP,
      icon: 'img/goodambulance.png',
      id: childKey
    });
最后,在
child\u changed
中,我获取
快照中对象的密钥,并在
driversMap
markersMap
中搜索它,然后删除过时的driver对象并将其重新添加到
driversMap
,然后获取驾驶员的纬度和经度,并使用
setPositione> 重新定位标记

delete driversMap[childKey];
driversMap[childKey] = childData;
      var latlng = {lat:parseFloat(driversMap[childKey].latPosition), lng: 
       parseFloat(driversMap[childKey].longPosition)};
      markersMap[childKey].setPosition(latlng);
以下是完整的代码:

函数getDrivers(){ var-arr=[]; var database=firebase.database().ref().child('allDrivers'); 数据库.on(“添加了child_”),函数(快照){ var childKey=snapshot.key; var childData=snapshot.val(); driversMap[childKey]=childData; var-latlng={lat:parseFloat(driversMap[childKey].latPosition),lng:parseFloat(driversMap[childKey].longPosition)}; var marker=new google.maps.marker({ 位置:latlng, 地图:地图, 动画:google.maps.animation.DROP, 图标:“img/goodcarbum.png”, id:childKey }); markersMap[marker.id]=标记器; }); 数据库上(“子对象已更改”,函数(快照){ var childData=snapshot.val(); console.log(childData); var childKey=snapshot.key; if(driversMap中的childKey和markersMap中的childKey) { 删除driversMap[childKey]; driversMap[childKey]=childData; var latlng={lat:parseFloat(driversMap[childKey].latPosition),lng: parseFloat(driversMap[childKey].longPosition)}; markersMap[childKey].setPosition(latlng); 删除markersMap[childKey]; } }); }
你能查一下我的帖子吗?