Why I am getting blank page for Mapboxgl api on IOS?

Question

Working on mapboxgl with ionic3, angular4 and cordova.

I have build .apk and .ipa files. I installed .apk file in my android device it works as expected (ie mapbox tiles, my icons (I have added some icons to custom some functionalities for eg. added an icon to switch the map style) and my markers are loaded successfully).

When I install the .ipa file in my Iphone my icons only loaded but mapbox tiles not getting loaded. Also the markers. I get blank white screen.

What is wrong with my implementation?

let data = {myJson data};

mapboxgl.accessToken = 'My access token';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v9',
attributionControl: false,
center: [-74.50, 40],
zoom: 12
});

map.on('load', function () {
 map.addSource("place", {
    type: "geojson",
   data: data,
   cluster: true,
   clusterMaxZoom: 14, // Max zoom to cluster points on
   clusterRadius: 50 // Radius of each cluster when clustering points (defaults to 50)
});

 map.addLayer({
"id": "places",
"type": "circle",
"source": "place",
"paint": {
  "circle-radius": 7,
  "circle-color": "#32CD32",
  "circle-stroke-width": 4,
  "circle-stroke-color": "#FFFFFF"
}

});

});

Can you help with me with the code added here?

This code works fine in Android. I mean map is loading as expected. But in Iphone My app is working but Map is not loading. Any guess what is wrong?

Answer 1

please check in info.plist for key MGLMapboxAccessToken is set with proper token. this is very important to set this value.

If you don't have source code even thought you can check by extraction IPA. below are step to extract IPA.

• Change extension from IPA to ZIP.
• Extract zip file
• In payload you will find app. right click on it and click on show package contents
• Open info.plist and search for key and it's value.

I hope you will get your answer