Maps v7: Mouse Click on a polygon and get ID vs v6.3

Fazer uma Pergunta

sexta-feira, 2 de março de 2012 23:32

0
In Bing Maps v6.3 I would
```
oVEMap.AttachEvent("onclick", function (e) {
  var shapeClicked = e.elementID && oVEMap.GetShapeByID(e.elementID);
  if (shapeClicked) {
    var id = shapeClicked.GetID();
  }
});
```
How is this done in Bing Maps v7?

-=Dan=-
- Movido Richard_BrundrittMicrosoft Employee, Owner sexta-feira, 16 de março de 2012 18:51 (From:Bing Maps: Map Control and Web services Development)
- Responder
- Citação

Todas as Respostas

quarta-feira, 7 de março de 2012 10:47

Moderador

You do this using this way:

1 - Extend the object model from Bing Maps AJAX v7 Control:

Microsoft.Maps.Pushpin.prototype.elementId = null;

2 - Add the event on the element that you want to add in your map

			var pushpin = new Microsoft.Maps.Pushpin(map.getCenter());
			pushpin.elementId = 'myid';
			map.entities.push(pushpin);
			Microsoft.Maps.Events.addHandler(map, 'click', function(e) { 
				if(e.targetType == 'pushpin') {
					alert(e.target.elementId);
				}
			});

Complete working sample:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title></title>
	<script type="text/javascript" charset="UTF-8" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0">
	</script>
	<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js" type="text/javascript"></script>
	<script type="text/javascript">
		var map = null;

		function getMap() {
			Microsoft.Maps.Pushpin.prototype.elementId = null;
		
			// Initialize the map
			map = new Microsoft.Maps.Map($('#map').get(0), {
				credentials: "Your Bing Maps Key",
				center: new Microsoft.Maps.Location(47.5, 2.75),
				zoom: 4,
				mapTypeId: Microsoft.Maps.MapTypeId.road
			});

			var pushpin = new Microsoft.Maps.Pushpin(map.getCenter());
			pushpin.elementId = 'myid';
			map.entities.push(pushpin);
			Microsoft.Maps.Events.addHandler(map, 'click', function(e) { 
				if(e.targetType == 'pushpin') {
					alert(e.target.elementId);
				}
			});
			
		}
		
	</script>
</head>
<body onload='getMap()'>
	<div id="map" style="position: relative; width: 800px; height: 600px;">
	</div>
</body>
</html>

Hope this will help.

MVP - Bing Maps - My blog (FR): http://blogs.developpeur.org/nicoboo/ Twitter: http://twitter.com/nicolasboonaert/

Marcado como Resposta Richard_BrundrittMicrosoft Employee, Owner sábado, 10 de março de 2012 13:50