brunob/leaflet.fullscreen

On IOS issues are caused when using icons on the map

mhoeneveld opened this issue · 2 comments

Hi Bruno.
Thanks for the work on this plugin. I was able to integrate it on an online Leaflet Satellite Tracker with success.
However on IOS it crashed. What I learned is that when the controls are loaded no icons are loaded anymore on IOS and further Javascript execution stops. On Windows with Chrome the script works perfect. Only on IOS devices it goes wrong either in Safari or Chrome as soon as the control is loaded.

This is the code used:
`
var base = L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}.png', {
minZoom: 0, // was 2
maxZoom: 8
});
var map = L.map('map', {
layers: [base],
tap: false, // ref Leaflet/Leaflet#7255
center: new L.LatLng(0, 0),
zoom: 2
});

// create fullscreen control *********************** When I remove this contol the icons are loaded and script is executed on IOS
var fsControl = L.control.fullscreen();
// add fullscreen control to the map
map.addControl(fsControl);

// events are fired when entering or exiting fullscreen.
map.on('enterFullscreen', function(){
console.log('entered fullscreen');
map.setZoom(4);
});

map.on('exitFullscreen', function(){
console.log('exited fullscreen');
map.setZoom(2);
});

// Add the sun to the map
var sunIcon = L.icon({
iconUrl: 'map/sun-real.png',
iconSize: [60, 60],
iconAnchor: [30, 30],
opacity: 0.7
});
var sunpos = L.marker([0, 0], {icon: sunIcon}).addTo(map);
`

Hi @mhoeneveld as i've said in #75 (comment) i think we can forget fullscreen API use on iOS cf Safari is supported on desktop and iPad, but not on iPhone. This is a limitation in the browser, not in Screenfull..

No feedback, closing for now, feel free to comment if needed.