This is a static archive of our old OpenStreetMap Help Site. Please post any new questions and answers at community.osm.org.

How to show cursor position in degrees in OpenLayers?

I'd like to place a simple map on a page, and the cursor location should be shown. I can do this but the location is shown in meters instead of degrees.

How can I change the units to degrees?

<!DOCTYPE HTML>
<title>OpenLayers Mouse Location Test</title>
<div id="demoMap" style="height:250px"></div>
<script src="OpenLayers.js"></script>

<script>
    map = new OpenLayers.Map("demoMap");
    map.addLayer(new OpenLayers.Layer.OSM());
    map.addControl(new OpenLayers.Control.MousePosition());
    map.zoomToMaxExtent();
</script>

Edit. Here's a screenshot clip of the map from the code above shown in Firefox:

Example map. Cursor is between Spain and Italy, and the widget displays "694659.71296, 4921321.62843".

cursor degrees meters mouseposition openlayers

asked 13 Jan '14, 21:09

gibbousmoon
16●1●1●2
accept rate: 0%

edited 14 Jan '14, 12:37

2 Answers:

This isn't a question for openstreetmap - it's purely an openlayers question. You'd be better asking on the openlayers mailing lists or on gis.stackexchange.com

In saying that, I know the answer since I've done this in the past :-) You need to set the projection of your map, and the displayProjection too. Controls like permalink and mouseposition use the displayProjection but often go wrong if the map projection isn't set too. Try something like:

map = new OpenLayers.Map(divName,
      { maxExtent: new OpenLayers.Bounds(-20037508,-20037508,20037508,20037508),
        numZoomLevels: 19,
        maxResolution: 156543,
        units: 'm',
        projection: "EPSG:900913",
        controls: [
          new OpenLayers.Control.LayerSwitcher({roundedCornerColor: "#575757"}),
          new OpenLayers.Control.Permalink('permalink'),
          new OpenLayers.Control.Permalink('editlink', 'https://www.openstreetmap.org/edit.html'),
          new OpenLayers.Control.Attribution(),
          new OpenLayers.Control.PanZoomBar(),
          new OpenLayers.Control.Navigation()
        ],
        displayProjection:  new OpenLayers.Projection("EPSG:4326") });

(taken from the OpenCycleMap source code)

answered 14 Jan '14, 17:32

Andy Allan
12.5k●23●128●153
accept rate: 28%

Thank you so much for the answer! :) Problem solved.

My apologies for posting this question here. To be honest, I didn't quite see how close this thing called OpenLayers is related to OSM.

(15 Jan '14, 10:23) gibbousmoon

The position is shown in degrees and not meters. Perhaps you want degrees.minutes.seconds or some other format instead of decimal degrees ? Which one ?

Sorry there doesn't seem to be an option to change the unit displayed in mouseposition. You could try patching mouseposition.js to get your prefered format.

answered 14 Jan '14, 09:30

Vincent de P... ♦
17.3k●18●152●249
accept rate: 19%

That said, non-decimal lat/long formats really should be forgoten about. Many people are used to them, but they are just pointlessly complicated, inherited from the time when a sextan was the best way to measure your location. Decimal degrees are better.

Decimal degrees (decimal units in general) really should be the only kind you use. Consider changing all your tools (including your brain) to decimal instead of the other way around.

(14 Jan '14, 09:36) Vincent de P... ♦

Thanks for your answer but it's not at all about deg:min:sec vs. decimal degs.

I had a many hours battle with OpenLayers but still cannot figure out how to change the units. The units are lying somewhere in class map or layer or projection. There must be a simple solution to this problem. I hope this a relevant question in this help center.

(14 Jan '14, 13:03) gibbousmoon