Direction not updated on screen rotation

[lmdc45]

Hi,
Seems when rotating screen on ios the direction still follow the top of the phone. When the screen rotate I would expect the direction arrow to change accordingly.

[domoritz]

Can you provide some more details?

• Phone
• What website
• Browser
• Permissions
• Errors on the js console
• OS

[lmdc45]

Is there a way I can see the console on iphone?
its on iphone 7, using the demo, with default browser safari, location and motion permission allowed while using the app
pictures below while only rotating the phone, I would expect the arrow to keep pointing below left when rotating

[domoritz]

Yes, I can confirm that this is a bug. Can you help fix it?

[lmdc45]

I am not a developer and have limited knowledge however will give it a try

[domoritz]

Hmm, somehow I cannot get the direction indicator to work right now. It looks like what we need to do is to correct the heading when the device orientation changes to landscape.

[domoritz]

Does https://labs.easyblog.it/maps/leaflet-compass/examples/simple.html works correctly for you?

[lmdc45]

No this above is not working on my phone

[8volution23]

Not sure if this has something to do with this, but looks like since iOS 13 Apple now requires using their permissions API:
https://medium.com/flawless-app-stories/how-to-request-device-motion-and-orientation-permission-in-ios-13-74fc9d6cd140

[criativocyber]

As I saw the picture above, How can I decrease the radius on current location and How can I implement that angle on circle.

Here is my code.

	var lc = L.control.locate({
		locateOptions: {
            enableHighAccuracy: true
		},
		strings: {
        	title: "Some Text",
        	popup: 'Some text 2'
    	}
	}).addTo(map);

[domoritz]

The arrow appears automatically when there is a compass location.

[criativocyber]

Can you give to me a code examples? That answer doesnt help to much

[lmdc45]

Issue doesn't appears when on windows chrome dev tool, the heading is displayed properly. Tried to fix it on ios but could not really so far, not sure if issue is ios only or android as well

this seems to solve it in my particular case:
in _onDeviceOrientation, add after active check:

        let oriAbs = "ondeviceorientationabsolute" in window;

        if (!oriAbs && e.webkitCompassHeading &&  window.orientation !== null) {
            this._setCompassHeading(e.webkitCompassHeading + window.orientation);
            return;
        }

[jedfrechette]

I believe this is an issue on both Android and iOS as I'm observing it on the demo Leaflet site with the following devices:

• Android (12) tablet with Chrome (127.06533.84)
• Samsung (14) phone with Chrome (118)
• IPhone 13 Pro (17.5.1) with Safari (17.5)

I'm more than happy to help debug, but am not accustomed to working with javascript on these mobile browsers so will need a little guidance on how to collect and provide more useful data.