Bing map issue in IOS

[Deepan]

Hi,
         In jquery mobile,  I am using Bing Map for My Mobile application.
         Its working fine in Android devices.
         But i am facing problem in IOS Devices.  Bing Map is not  properly displaying in map view full screen width, its showing only half of the map.
         here i attached screen shot

Html file

 <div  id="dashboardMap" style="width:90%;"></div>

js file

                         var myOptions = {
                         credentials: BING_MAP_KEY,
                         center: userposition,
                         mapTypeId: Microsoft.Maps.MapTypeId.collinsBart,
                         zoom: 18,
                         showScalebar: true,
                         }
                   
                      var $content = $("#EquipmentMap");
                      map = new Microsoft.Maps.Map($content[0], myOptions);

Thanks & Regards
        Deepan

[Tina Stancheva]

Hello Deepan,

I created a sample app using the code snippet you sent and I deployed it on a few iOS devices:

• iPhone 4 with iOS 6.0.1
• iPhone 5C with iOS 7.1.2
• iPad with iOS 7.0.4

On all devices I manged to properly display the map and I did not detect the issue you reported. I also tested the app behavior in the AppBuilder Simulator and again the map was properly displayed while simulating the available iOS devices.

I attached the sample so that you can have a look at it on your side and let me know if there is anything I might be missing.

Regards,
Tina Stancheva
Telerik

 

 

[Deepan]

Hi,
       Problem get solved in my side, slightly changed bing map code now its working fine in IOS Device. But i don't know why old code is affected bing map in IOS device.

Html file

 <div  id="dashboardMap"></div>

js file

                         var myOptions = {

                         credentials: BING_MAP_KEY,

                         }

                      var $content = $("#dashboardMap");

                      map = new Microsoft.Maps.Map($content[0], myOptions);



Thanks & Regards

        Deepan

[Tina Stancheva]

Hello Deepan,

I am not sure why these changes fixed the issue on your devices. It might be something coming from the width of the div object wrapping the map or from the settings of another element holding that div but as I was not able to reproduce it locally I cannot say for sure.

In any case I am happy to see that you've managed to resolve the issue.

Regards,
Tina Stancheva
Telerik