question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Compass indicator not showing on iOS Safari

See original GitHub issue

Hi, I am using the option showCompass when initializing the locatecontrol plugin and it is working fine on Chrome and Firefox on iOS but it does not show the compass heading indicator when using Safari.

This is my configuration:

`var lc = L.control.locate({ showPopup: false, drawCircle : true, position: ‘topright’, showCompass: true, keepCurrentZoomLevel: true, flyTo: false, clickBehavior: { inView: ‘setView’, outOfView: ‘setView’, inViewNotFollowing: ‘inView’
}, locateOptions:{ enableHighAccuracy: true, maxZoom: 15 } }).addTo(map);

lc.start();`

Is anyone else having the same problem?

Thanks

Issue Analytics

  • State:open
  • Created 3 years ago
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
robertdijkcommented, May 11, 2020

Hi, I had the same issue for a moment. I tried my own website and the demo on my iPhone Xs on Firefox 25.1, Chrome 81.0.4044.124, and Safari on iOS 13.4.1. For some combinations it did work, and for some, it didn’t. Also when I switched to a private tab, I would work. I noticed that when it did work it not only asked permission for location, but also for direction.

The solution that worked for me: Reboot my iPhone.

After that, both sites worked on all 3 browsers for me. Probably something was cashed wrong locally.

0reactions
jessegpiercecommented, Feb 9, 2022

I just realized the above linked issue is marked closed, so I’ll comment here.

In searching for an answer to this issue, I found this thread located here: https://developer.apple.com/forums/thread/128376. For my quick solution, I put this snippet at the top of my L.Control.Locate.js file:

//Request permission to use heading for ios function requestDeviceOrientation () { if (typeof DeviceOrientationEvent !== 'undefined' && typeof DeviceOrientationEvent.requestPermission === 'function') { DeviceOrientationEvent.requestPermission() .then(permissionState => { if (permissionState === 'granted') { window.addEventListener('deviceorientation', () => {}); } }) .catch(console.error); } else { // handle regular non iOS 13+ devices console.log ("not iOS"); } }

This requests permission from the user to accept access to the user’s device orientation data. Once it loads it gives correct heading on the geolocation icon. Using iPhone 11 Pro Max ios 15.1.

Regards,

Jesse @ northdakotarigsmap dot com

Read more comments on GitHub >

github_iconTop Results From Across the Web

The safari compass logo is missing. Inst… - Apple Community
Open Safari from the Applications folder. Then control - click on the Dock icon, choose Options, and Keep in Dock.
Read more >
5 Ways to Fix iPhone Compass Not Working - iMyFone
Way 1: Calibrate iPhone Compass · Way 2: Check Your Compass Settings · Way 3: Restart Your Compass/iPhone · Way 4: Reset Location...
Read more >
I want my safari icon to work as an actual compass. - Reddit
Anyone else experiencing this issue where AirPods case are always shown at no battery after 16.2 update ? (Same issue on my iPad...
Read more >
iPhone Compass Not Working? Showing Wrong Directions? Fix
Go to Settings > Privacy > Location Services and ensure that Location Services is enabled and Compass is set to While Using the...
Read more >
How to Use the Compass App on an iPhone in Several Ways
1. Launch the Compass app from your iPhone's home screen. Or if you don't have it installed — maybe you deleted it in...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found