Question

I’m using the Bing Maps v7 control.

I have an array of latitude/longitude points. (of type Microsoft.Map.Location)

From that array, I can generate a rectangle, and a center of the rectangle, using LocationRect.fromLocations()

When creating a map with the Map constructor, I can center the map using the center of that rectangle. It looks something like this:

    var LLA = [
       new Microsoft.Maps.Location(43.386,-111.6123),
       new Microsoft.Maps.Location(43.4929, -112.0349),
       new Microsoft.Maps.Location(43.2609,-115.7811),
       ...
    ];
    var r = Microsoft.Maps.LocationRect.fromLocations(LLA);
    var mapOptions = {
        credentials : bingMapsKey,
        center      : r.center,
        mapTypeId   : Microsoft.Maps.MapTypeId.road,
        zoom        : 7
    },
    elt = document.getElementById('out2');
    var map = new Microsoft.Maps.Map(elt, mapOptions);

That works, and the map that gets created is centered around those points. How can I set the zoom level of the Bing Map so that it displays the entire rectangle?

See here: http://jsfiddle.net/MQ76x/

Answer 1

Forget passing center/zoom, and pass the rectangle as bounds instead:

var mapOptions = {
  credentials : bingMapsKey,
  bounds      : r, // <-- HERE
  mapTypeId   : Microsoft.Maps.MapTypeId.road
}