Openlayers 2 getLonLatFromLayerPx() gives wrong coords after pan

Question

I'm trying to display mouse position on external div (ExtJS based) using this code :

map.events.register("mousemove", map, function(e) {

        position = map.getLonLatFromLayerPx(this.events.getMousePosition(e));
        position = position.transform(new OpenLayers.Projection("EPSG:900913"), new OpenLayers.Projection("EPSG:4326"));            
        Ext.fly(mouseposition.getEl()).update("Lat (N): " + position.lat.toFixed(4) + "   Long (E): " + position.lon.toFixed(4) );
    });

The problem is that when I pan the map than the coords I get are the original from before the pan , only if I zoom in/out than I get the correct coords from the mouse position.

How can I fix this ?

Here is example (look on the coords on the bottom of the map) :

1. Initial load over Israel , see the lat/lon of the mouse.

2. I pan over to europe , lat/lon stay around the same values of the original map extent

3. I zoom in and back out and the lat/lon update to the current map view extent range.

Answer 1

You should use getLonLatFromPixel instead of getLonLatFromLayerPx. Unfortunately the latter method is not documented at all (see here) so I'll leave it to you to investigate where they differ.

You can easily verify this by going to http://openlayers.org/two/ and pasting the following code in your JS console:

map.events.register("mousemove", map, function(e) {
  var position = map.getLonLatFromPixel(this.events.getMousePosition(e));
  position = position.transform(new OpenLayers.Projection("EPSG:900913"), new OpenLayers.Projection("EPSG:4326"));
  console.log("Lat (N): " + position.lat.toFixed(4) + "   Long (E): " + position.lon.toFixed(4));
});

Now grabbing and dragging an area using your mouse will show that lon/lat stays the same, that is - correct.

Note that if you try the same code with getLonLatFromLayerPx instead the coordinates "slide" along with the map that you're dragging which is clearly wrong (and this is what I descripbed in my comment under your question).

---

If I misunderstood your description please try to create a function that's easily reproducible, e.g. by pasting on http://openlayers.org/two/ and watching the JS console.