Question

In this JSON-P callback I’m trying to extend the object called bounds (declared earlier) by each downloaded marker in the iteration. In the log, it does get set as a bounds object, but the NE SW are the same:

ie
$: de
b: 18.031393699999967
d: 18.031393699999967
__proto__: de
Y: he
b: 59.2933167
d: 59.2933167
__proto__: he
__proto__: ie

Why?? This is driving me insane..

addStoreMarkers: function(data) {
            /** This is the function that the injected script automatically calls, it passes the markers data in the form 
                JSON (an array object) as an argument. **/

                //iterate over each instance in the data
                for (var i in data.markers) {

                    //set marker icon
                    var image = new google.maps.MarkerImage('images/'+ data.markers[i].icon  +'.png',
                        new google.maps.Size(32.0, 37.0),
                        new google.maps.Point(0, 0),
                        new google.maps.Point(16.0, 37.0)
                    );

                    //set icon shadow
                    var shadow = new google.maps.MarkerImage('images/shadow.png',
                        new google.maps.Size(51.0, 37.0),
                        new google.maps.Point(0, 0),
                        new google.maps.Point(16.0, 35.0) 
                    );

                    //add markers to map
                    var marker = new google.maps.Marker({
                        position: new google.maps.LatLng(data.markers[i].lat, data.markers[i].lgt),
                        map: map,
                        visible: false,
                        icon: image,
                        shadow: shadow
                    });

                    //add marker to markers array   
                    markers.push(marker);

                    //create the bounds representing all downloaded markers
                    bounds = new google.maps.LatLngBounds();
                    bounds.extend(marker.position);

                    //store infoBox data in markers array
                    markers[i].store = data.markers[i].store;
                    markers[i].distance = data.markers[i].distance;
                    markers[i].i = i;

                    //add click-listener to marker
                    google.maps.event.addListener(markers[i], 'click', function() {
                        //on click
                            //set parameter active (so it won't hide)
                            Map.setMarkerActive(this);
                            //call todisplay custom infoWindow function
                            Map.displayInfo(this);
                    });

                }

                console.log(bounds);

                //fitbounds if requested, else pan a bit to call updateView
                if(first){Map.fitBounds(5);first=false;} else {map.panBy(1,1);}

                //remove data from the DOM
                ejectDOM('#jsonp_ref');

                //notify
                Menu.setStatus('Klart!');

                //housekeeping
                delete data;

                console.log('add markers function complete ' + markers.length);
        },

Answer 1

//create the bounds representing all downloaded markers
bounds = new google.maps.LatLngBounds();
bounds.extend(marker.position);

You are creating an new bounds for each marker. You should create the bounds outside of the for loop.