OpenLayers: how to change format of MousePosition coordinates to HDMS?

Question

I'm using the MousePosition control to show the mouse coordinates as it moves but I'm showing an output similar to this: '7.85, 47.98' but I wanted an output like this: '47° 58′ 60.0″ N 7° 50′ 60.0 " E'.

JS

var mouseposition = new ol.control.MousePosition({
            projection: 'EPSG:4326',
            coordinateFormat: ol.coordinate.createStringXY(2),
            undefinedHTML: '',
            className: 'ol-mouse-position ol-control'
        });
        map.addControl(mouseposition);

I've tried to use toStringHDMS() but it wasn't in the format I wanted, I don't know if I used it wrong

var mouseposition = new ol.control.MousePosition({
            projection: 'EPSG:4326',
            coordinateFormat: ol.coordinate.toStringHDMS(),
            undefinedHTML: '',
            className: 'ol-mouse-position ol-control'
        });
        map.addControl(mouseposition);

n this example the output was: -46.20849609375,-23.595295498937958

Answer 1

Use

coordinateFormat: ol.coordinate.toStringHDMS,

without ().

createStringXY() is a function which returns a CoordinateFormat function

toStringHDMS is already a CoordinateFormat function