Export (0) Print
Expand All

Map Class

Bing

Represents a map.

Constructor

Name Definition Description

Map

Map(containerElement:node, options?: MapOptions or ViewOptions)

Initializes a new instance of the Map class.

Properties

Name Type Description

entities

EntityCollection

The map’s entities. Use this property to add or remove entities from the map.

Static Methods

Name Definition Return Value Description

getVersion

getVersion()

string

Returns the version of the map control.

Methods

Name Definition Return Value Description

blur

blur()

None

Removes focus from the map control so that it does not respond to keyboard events.

dispose

dispose()

None

Deletes the Map object and releases any associated resources.

focus

focus()

None

Applies focus to the map control so that it responds to keyboard events.

getBounds

getBounds()

LocationRect

Returns the location rectangle that defines the boundaries of the current map view.

getCenter

getCenter()

Location

Returns the location of the center of the current map view.

getCopyrights

getCopyrights(callback:function)

string[]

Returns to the specified callback an array of strings representing the attributions of the imagery currently displayed on the map.

getCredentials

getCredentials(callback:function)

None

Gets the session ID. This method calls the callback function with the session ID as the first parameter.

map.getCredentials(function(credentials)
{
if(credentials !== null) { /* Valid session Id. Use it to call REST service */ }
});

getHeading

getHeading()

number

Returns the heading of the current map view.

getHeight

getHeight()

number

Returns the height of the map control.

getImageryId

getImageryId()

string

Returns the string that represents the imagery currently displayed on the map.

getMapTypeId

getMapTypeId()

string

Returns a string that represents the current map type displayed on the map. Valid map types are listed in the MapTypeId Enumeration topic. Note that the short name and not the full MapTypeId string is returned. For example, 'a' is returned when the MapTypeId is set to 'Aerial'.

getMetersPerPixel

getMetersPerPixel()

number

Returns the current scale in meters per pixel of the center of the map.

getMode

getMode()

MapMode

Returns the current map mode.

getModeLayer

getModeLayer()

Node

Returns the map’s mode node.

getOptions

getOptions()

MapOptions

Returns the map options that have been set. Note that if an option is not set, then the default value for that option is assumed and getOptions returns undefined for that option.

getPageX

getPageX()

number

Returns the x coordinate of the top left corner of the map control, relative to the page.

getPageY

getPageY()

number

Returns the y coordinate of the top left corner of the map control, relative to the page.

getRootElement

getRootElement()

Node

Returns the map’s root node.

getTargetBounds

getTargetBounds()

LocationRect

Returns the location rectangle that defines the boundaries of the view to which the map is navigating.

getTargetCenter

getTargetCenter()

Location

Returns the center location of the view to which the map is navigating.

getTargetHeading

getTargetHeading()

number

Returns the heading of the view to which the map is navigating.

getTargetMetersPerPixel

getTargetMetersPerPixel()

number

Returns the scale in meters per pixel of the center of the view to which the map is navigating.

getTargetZoom

getTargetZoom()

number

Returns the zoom level of the view to which the map is navigating.

getUserLayer

getUserLayer()

Node

Returns the map’s user node.

getViewportX

getViewportX()

number

Returns the x coordinate of the viewport origin (the center of the map), relative to the page.

getViewportY

getViewportY()

number

Returns the y coordinate of the viewport origin (the center of the map), relative to the page.

getWidth

getWidth()

number

Returns the width of the map control.

getZoom

getZoom()

number

Returns the zoom level of the current map view.

getZoomRange

getZoomRange()

object:{min:number, max: number}

Returns the range of valid zoom levels for the current map view.

isDownloadingTiles

isDownloadingTiles()

boolean

Returns a boolean indicating whether map imagery tiles are currently being downloaded.

isMercator

isMercator()

boolean

Returns a boolean indicating whether the map is in a regular Mercator nadir mode.

isRotationEnabled

isRotationEnabled()

boolean

Returns true if the current map type allows the heading to change; false if the display heading is fixed.

setMapType

setMapType(mapTypeId:string)

None

Sets the current map type. The specified mapTypeId must be a valid map type ID or a registered map type ID. Valid map type IDs are listed in the MapTypeId Enumeration topic.

setOptions

setOptions(options: MapOptions )

None

Sets MapOptions such as the width and height of the map and whether panning of the map is allowed. Note that some map options can only be set in the Map constructor as stated in the map option description.

setView

setView(options: ViewOptions )

None

Sets the map view based on the specified options.

tryLocationToPixel

tryLocationToPixel(location: Location | Location [], reference?: PixelReference )

null, Point, or Point[]

Converts a specified Location to a Point on the map relative to the specified PixelReference. If reference is not specified, PixelReference.viewport is used. If the map is not able to convert the Location, null is returned.

Alternatively, converts an array of Locations and returns an array of Points if all locations were converted. If any of the conversions fail, null is returned.

tryPixelToLocation

tryPixelToLocation(point: Point | Point [], reference?: PixelReference )

null, Location, or Location[]

Converts a specified Point to a Location on the map relative to the specified PixelReference. If reference is not specified, PixelReference.viewport is used. If the map is not able to convert the Point, null is returned.

Alternatively, converts an array of Points and returns an array of Locations if all points were converted. If any of the conversions fail, null is returned.

Events

Name Arguments Description

click

eventArgs:MouseEventArgs

Occurs when the mouse is used to click the map.

copyrightchanged

None

Occurs when the copyright of the map changes.

dblclick

eventArgs:MouseEventArgs

Occurs when the mouse is used to double click the map.

imagerychanged

None

Occurs when the underlying imagery used by the map changes. This is different from the maptypechanged event, which occurs when the map type being used is changed.

keydown

eventArgs:KeyEventArgs

Occurs when a keyboard key is pressed down.

keypress

eventArgs:KeyEventArgs

Occurs when a keyboard key is pressed.

keyup

eventArgs:KeyEventArgs

Occurs when a keyboard key that is pressed down is released.

maptypechanged

None

Occurs when the map type changes.

mousedown

eventArgs:MouseEventArgs

Occurs when the left mouse button is pressed when the mouse cursor is over the map.

mousemove

eventArgs:MouseEventArgs

Occurs when the mouse cursor moves over the map.

mouseout

eventArgs:MouseEventArgs

Occurs when the mouse cursor moves out of the area covered by the map.

mouseover

eventArgs:MouseEventArgs

Occurs when the mouse is over the map.

mouseup

eventArgs:MouseEventArgs

Occurs when the left mouse button is lifted up when the mouse cursor is over the map.

mousewheel

eventArgs:MouseEventArgs

Occurs when the mouse wheel is used when the mouse cursor is over the map.

optionschanged

None

Occurs when one or more map options change.

rightclick

eventArgs:MouseEventArgs

Occurs when the right mouse button is used to click the map.

targetviewchanged

None

Occurs when the view towards which the map is navigating changes.

tiledownloadcomplete

None

Occurs when all the map tiles of a map view have loaded.

viewchange

None

Occurs for every frame of a map view change.

viewchangeend

None

Occurs when the map view is done changing.

This event occurs when a view is the same for one frame of a map view change. For example, if the mouse is used to drag the map to change the view, but pauses during the drag (without releasing the mouse button), viewchangeend occurs twice. You can use the addThrottledHandler method to customize the number of events that occur.

viewchangestart

None

Occurs when the map view starts changing.

Examples

<!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=7.0"></script>

      <script type="text/javascript">

         var map = null;         

         function GetMap()
         {
            // Initialize the map
            map = new Microsoft.Maps.Map(document.getElementById("myMap"),
                         {credentials:"Bing Maps Key"}); 

         }

      </script>
   </head>
   <body onload="GetMap();">
      <div id='myMap' style="position:relative; width:400px; height:400px;"></div>
   </body>
</html>


This example shows how to detect when map options change.

<!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=7.0"></script>
      <script type="text/javascript">
          var map;

          function GetMap() {
              map = new Microsoft.Maps.Map(document.getElementById("myMap"), { credentials: "YOUR_BING_MAPS_KEY" });
              Microsoft.Maps.Events.addHandler(map, 'optionschanged', viewChanged);
          }

          function viewChanged(e) {
              var options = map.getOptions();
              if (options.labelOverlay == Microsoft.Maps.LabelOverlay.hidden) {
                  alert("labels turned off");
              }
              else {
                  alert("labels turned on");
              }
          }
      </script>
   </head>

   <body onload="GetMap();">
      <div id='myMap' style="position:relative;width:600px;height:400px;"></div>       
   </body>

</html>

Show:
© 2014 Microsoft