how to display map center coordinate using OpenLayers

Question

As far as I know OpenLayers can display our mouse coordinate position. However, I do not know how to display map center coordinate? Can anyone help me?

Answer 1

The easiest way would be to add an event to the map object so that on moveend some div (or something else) is updated. The map center itself can easily be retrieved from the map object with getCenter. For example:

map.events.on({
        "moveend":function(){
            alert(map.getCenter().toString());
        }
    });

Answer 2

You need to build a new Control, say OpenLayers.Control.MapCenter(). You can take OpenLayers.Control.MousePosition, rename it and change the registering of the events in the activate method. Remember also to change the unregistering in the deactivate method. Then you need to include js file with the definition of the new control and add it to you map: map.addControl(new OpenLayers.Control.MapCenter())

Answer 3

ol v 6.2.* try this:

map.on('pointerdrag', function() { 
  let centerPosArr = map.getView().getCenter();
  let coords = ol.proj.toLonLat(centerPosArr, 'EPSG:3857');  
  console.log(coords);
});