I'm seeing a lot of answers on StackOverflow that say that JavaScript executes code sequentially, but I can actually see my own JavaScript not doing so. From the following code:
function centre_map(lat, lng, zoom_level) {
alert('centre_map');
map = new GMap2(document.getElementById('map_canvas'));
var latlng = new GLatLng(lat, lng);
map.setCenter(latlng, zoom_level);
}
function add_markers_within_bounds() {
alert('add_markers_within_bounds');
// add numerous BLUE markers within map bounds using MarkerClusterer
}
function add_marker(lat, lng, place_name, grid, county) {
alert('add_marker');
// add one ordinary RED Google Maps marker
}
centre_map('{{lat}}', '{{lng}}', 12);
add_markers_within_bounds('{{grid}}', '{{place_name}}');
add_marker('{{lat}}', '{{lng}}', '{{place_name}}', '{{grid}}', '{{county}}');
I get the following sequence of events:
'centre_map' alert
'add_markers_within_bounds' alert
'add_marker' alert
individual RED marker appears on map (i.e. add_marker renders)
multiple BLUE markers appear on map (i.e. add_markers_within_bounds renders)
Why doesn't add_markers_within_bounds complete before add_marker gets under way: and how can I make it do so?
I know that one way might be to call add_marker from within add_markers_within_bounds, but for various reasons I'd rather keep it as a separate function.
