我正在尝试使用 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));
});