Bing Map v7 : <a href inside infobox not working on iphone4

Friday, June 10, 2011 12:23 PM

0
Hi,

I have a hyperlink inside infobox . Clicking the link doesnot do anything when tested on safari iphone. Works fine for desptop chrome. Is this a infobox bug ?Can anybody testify this and probably suggest a workaround ?

Thanks,

Monis
- Moved by Richard_BrundrittMicrosoft Employee, Moderator Saturday, March 10, 2012 10:39 AM (From:Bing Maps: Map Control and Web services Development)
- Moved by Richard_BrundrittMicrosoft Employee, Moderator Saturday, March 10, 2012 10:41 AM (From:Bing Maps AJAX Controls)

All Replies

Saturday, June 11, 2011 9:53 AM

I am using the below piece of code. Clicking the link in the infobox doesnot open in Iphone4,3 and Andriod 2.1,2.2. I also tried putting a link in the infobox content in bing map v7 interative SDK under infobox -> setHtmlContent, this also failed on iphone/andriod. Please look into this.

<!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" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 <style>
.bigInfoboxTop {
 height: 7px;
 width: 200px
}

.bigInfoboxMiddle {
 background-color: #fff;
 background-repeat: repeat-y;
 padding-left: 10px;
 padding-right: 10px;
 width: 190px
 
}

.bigInfoboxBottom {
 height: 22px;
 width: 200px
}
</style>
 <script charset="UTF-8" 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()
 {
 try{
 map = new Microsoft.Maps.Map(document.getElementById("canvas"), {
 credentials : "Bing Map Key",
 center: new Microsoft.Maps.Location(45.5, -122.5),
 mapTypeId : Microsoft.Maps.MapTypeId.road,
 zoom : 7
 });
 var center = map.getCenter();
 
 // Add a pin to the center of the map
 var pin = new Microsoft.Maps.Pushpin(center, {text: '1'});
 map.entities.push(pin);
 var infobox = new Microsoft.Maps.Infobox(center, {
 offset : new Microsoft.Maps.Point(-100, 120),
 showCloseButton : false
 
 });
 map.entities.push(infobox);
infobox.setHtmlContent('<div class="bigInfoboxTop"></div><div class="bigInfoboxMiddle"><a href="http://www.bing.com">This is Infobox</a>This is InfoboxThis is Infobox This is Infobox This is Infobox</div><div class="bigInfoboxBottom"></div>')
 
 }
 catch(e){
 alert('Error');
 }
 
 }


 
 </script>

 

 </head>
 <body onload="GetMap();">
 <div id="canvas" style="position:relative;height:500px;width:600px">
 hello
 </div>
 
 </body>
</html>

Thanks,

Monis

Tuesday, August 23, 2011 11:11 PM

0

I will also confirm I have encountered the same issue with the iPhone and iPad with any clickable items inside of an infobox. They work fine on a desktop PC but not on touch devices.
C#, ASP.NET San Diego, California programmer