Was this page helpful?
Your feedback about this content is important. Let us know what you think.
Additional feedback?
1500 characters remaining
Export (0) Print
Expand All

VEMap.Resize Method

You are not viewing the latest version of the AJAX control. Bing Maps AJAX V7 is the recommended JavaScript control for Bing Maps. If you need this documentation, it is available in as a CHM or PDF download.

Resizes the map based on the specified width and height.


VEMap.Resize(width, height);

Parameters

Parameter Description

width

The width, in pixels, of the map. Optional.

height

The height, in pixels, of the map. Optional.

If this method is called with no parameters, the map is resized to fit the entire DIV element.

This method triggers the VEMap.onresize Event.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
   <head>
      <title></title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

      <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3"></script>

      <script type="text/javascript">
         var map = null;
 
         function GetMap()
         {
            map = new VEMap('myMap');
            map.LoadMap();

            map.AttachEvent("onresize", OnResize);
         }   
     
         function ResizeMap()
         {
            if ((document.getElementById('txtWidth').value != "" && document.getElementById('txtHeight').value != "") && (!isNaN(document.getElementById('txtWidth').value) && !isNaN(document.getElementById('txtHeight').value)))
            {
               map.Resize(document.getElementById('txtWidth').value, document.getElementById('txtHeight').value);
               myMap.style.width = document.getElementById('txtWidth').value + "px";
               myMap.style.height = document.getElementById('txtHeight').value + "px";
            }
            else
            {
               alert("Please enter a valid numeric value.");
            }
         }
     
         function OnResize(e)
         {
            alert(e.eventName + " has been called.");
            return 0;
         }
      </script>
   </head>
   <body onload="GetMap();" style="font-family:Arial">
      <div id='myMap' style="position:relative; width:400px; height:400px;"></div>
      Width: <input id="txtWidth" type="text" value="400" style="width:50px" /> pixels&nbsp;|&nbsp;
      Height: <input id="txtHeight" type="text" value="400" style="width:50px" /> pixels&nbsp;
      <input id="btnResize" type="button" value="Resize Map" name="btnResize" onclick="ResizeMap()">
   </body>
</html>

Show:
© 2015 Microsoft