Mapbox GL JS not showing user heading, always points north

Question

I have a Mapbox-GL-JS script that is working fine. However, the arrow next to the blue user location dot always points north. I thought the showUserHeading option is supposed to point in the direction (bearing) the user is moving. Anyone have a fix for this?

var geolocate = new mapboxgl.GeolocateControl({
    positionOptions: {
        enableHighAccuracy: true
    },
    trackUserLocation: true,
    showUserHeading: true,
    showUserLocation: true,
    showAccuracyCircle: true
    });

Answer 1

It happened to me and I had to calibrate the phone's compass by moving the phone around for a few seconds, the bearing then appeared