Javascript: Generating object keys inside a loop and pushing an array of objects into each?
I am working on a Google Map here: http://crocdoc.ifas.ufl.edu/projects/chameleonmapdev/
I have the data for the markers set up in this format:
var nights = ['July1211', 'July1411'];
var waypoint_data = {
July1211: [
//Lat, long, j/a (juvenile/adult)
[25.429363, -80.508326, j],
[25.429332, -80.508216, j]
],
July1411: [
[25.42936, -80.51023, j],
[25.42936, -80.51036, j]
]
};
And the function that builds the points looks like this:
function buildPoints() {
//var marker_container = new Object;
for ( i = 0; i < nights.length ; i++ ) {
//Loop for each data point that night
for ( h = 0; h < waypoint_data[nights[i]].length; h++) {
var marker = new 开发者_开发百科google.maps.Marker({
position: new google.maps.LatLng(waypoint_data[nights[i]][h][0], waypoint_data[nights[i]][h][1]),
icon: waypoint_data[nights[i]][h][2],
shape: pointshape,
map: map
});
//Push waypoints into date-specific object key
//marker_container[nights[i]].push(marker);
}
}
}
I would like to push the markers for each date (night[i]) into a different object key so that I can hide/show a specific night's markers. I've tried doing this with the two marker_container lines I've commented out, but they just break my loop, and in Firebug, I get an error about marker_container[nights[i]] being undefined. nights[i] is a string, so I thought this syntax would work. Any hints are greatly appreciated, and I'm very open to suggestions for other, better ways to code this.
You can't use push
on an Object, only on array. I think this is what you want to do:
function buildPoints() {
var marker_container = new Object();
for ( i = 0; i < nights.length ; i++ ) {
marker_container[nights[i]] = new Array();
//Loop for each data point that night
for ( h = 0; h < waypoint_data[nights[i]].length; h++) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(waypoint_data[nights[i]][h][0], waypoint_data[nights[i]][h][1]),
icon: waypoint_data[nights[i]][h][2],
shape: pointshape,
map: map
});
//Push waypoints into date-specific object key
marker_container[nights[i]].push(marker);
}
}
}
simple proof of concept jsfiddle
If you know how many markers you'll have (let's say 10), set-up the marker container, making each element of the object an object itself, of length 2:
marker_container= new Object(10);
for (i=0; i<marker_container.length; i++){
marker_container[i]=new Object(2);
}
After creating your markers, add them to the marker_container:
marker_container[i][0] = nights[i];
marker_container[i][1] = marker;
When you want to display and hide a marker, do this:
//display
marker_container['nightX'].setMap(map);
//hide
marker_container['nightX'].setMap(null);
精彩评论