[OpenLayers-Users] attaching a control to an external div

[Andreas Hocevar]

Hey-

P Kishor wrote:
> Per the docs for Control
>
> "Controls by default are added to the map they are contained within
> however it is possible to add a control to an external div by passing
> the div in the options parameter."
>
> which seems to be completely not like the source code at
> http://openlayers.org/dev/examples/mouse-position.html
>
>
> So, I have the following
>
> <div id="map"></div>
> <div id="coords"></div>
>
>
> <script type="text/javascript">
>
> // The following works, but the mouse position is displayed on the map
> var ctrl_coords = new OpenLayers.Control.MousePosition();
> map.addControl(ctrl_coords);
>
> // The following does not work
> var ctrl_coords = new OpenLayers.Control({div: "coords"});
> ctrl_coords.MousePosition();
> map.addControl(ctrl_coords);
>   

This cannot work, it is syntactically incorrect.

> // The following also does not work
> var ctrl_coords = new OpenLayers.Control.MousePosition({div: "coords"});
>   
Change the line above to:

var ctrl_coords = new OpenLayers.Control.MousePosition({div: document.getElementById("coords")});


> map.addControl(ctrl_coords);
> </script>
>
> Pointers please, as I want to display the mouse position inside the
> "coords" div. Does the documentation need to be updated as well?
>   

The documentation looks accurate to me, since it says that the div 
option expects a DOMElement, not a string. Just try the above fix and 
you should be fine.

Regards,
Andreas.

-- 
Andreas Hocevar
OpenGeo - http://opengeo.org/
Expert service straight from the developers.