Geofire在加载时加载所有键

时间:2015-08-04 20:39:15

标签: javascript jquery google-maps firebase geofire

我正在尝试使用Geofire创建一个应用程序,该应用程序使用Firebase(显然)在一定范围内将点加载到地图上。但是,我注意到当我启动应用程序时,我的数据集中的所有点最初都被预加载到我的数组中。我只想加载半径范围内的数据点。用户拖动/缩放后会删除数据点,但我不希望这些点首先出现在那里。如何才能使其仅在半径内加载数据?

任何帮助将不胜感激!谢谢!

var myDataRef = new Firebase("https://[FIREBASE].firebaseio.com/");
var geoFire = new GeoFire(myDataRef.child("_geofire"));
var vendsList = {};
var geoQuery = geoFire.query({
      center: [currentPos.lat(), currentPos.lng()],
      radius: 0 //kilometers
});

function initialize() {
   geocoder = new google.maps.Geocoder();
   directionsDisplay = new google.maps.DirectionsRenderer();

   mapOptions = {
     zoom: 14,
    mapTypeControlOptions: {
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID]
    },
  };

  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  infoWindow = new google.maps.InfoWindow();

  pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);

  currentPos = pos;
  startPos = pos;
  map.setCenter(pos);
  map.setZoom(18);

  google.maps.event.addListener(map, 'drag', function() { 

    currentPos = map.getCenter();
    geoQuery.updateCriteria({
        center: [currentPos.lat(),currentPos.lng()],
        radius: getRadius()
    });

  });
  google.maps.event.addListener(map, 'zoom_changed', function() { 

    currentPos = map.getCenter();
    geoQuery.updateCriteria({
        center: [currentPos.lat(),currentPos.lng()],
        radius: getRadius()
    });

  } );

}
google.maps.event.addDomListener(window, 'load', initialize);

geoQuery.on("key_entered", function(vendID, vehicleLocation) {

  vendsList[vendID] = true;

  myDataRef.child(vendID).once("value", function(dataSnapshot) {

    vend = dataSnapshot.val();

    if (vend !== null && vendsList[vendID] === true) {

      vendsList[vendID] = vend;

      createMarker(vend);

    }
  });

  console.log(Object.keys(vendsList));

});
geoQuery.on("key_exited", function(key, location, distance) {

  console.log("key");

  var vend = vendsList[key];

  vend.marker.setMap(null);

  delete vendsList[key];

  console.log(Object.keys(vendsList));

});

0 个答案:

没有答案