Hello,
I am using the Ionic framework for about one day and I absolutely love it already. I started building an App that uses the leaflet framework for it’s maps; but I’ve hit a problem.
The leaflet map is working in the browser (ionic serve) on iOS, Android and OSX; but when I build the app and run it as a native app on iOS it doesn’t work anymore. The map simply becomes gray. I have a screenshot here:
The view
<ion-tab title="Tab 3" icon-on="ion-ios7-location" icon-off="ion-ios7-location-outline">
<ion-content has-header="true" scroll="false" data-tap-disabled="true">
<leaflet center="center" class="superfill"></leaflet>
</ion-content>
</ion-tab>
The controller
angular.extend($scope, {
center: {
lat: 52.35,
lng: 4.91,
zoom: 12
},
legend: {
position: 'bottomleft',
colors: [ '#ff0000', '#28c9ff', '#0000ff', '#ecf386' ],
labels: [ 'National Cycle Route', 'Regional Cycle Route', 'Local Cycle Network', 'Cycleway' ]
},
defaults: {
tileLayer: "http://{s}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png",
scrollWheelZoom: false
}
});