Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Openlayers style the CSS feature popup

Tags:

css

openlayers

Might anyone know of a way to style the CSS of a popup used in Openlayers?

Using an OL popup method, returned is a div with an ID of

Would I just add that to my CSS and style, or might there be a better way?

like image 332
user1040259 Avatar asked Feb 27 '12 17:02

user1040259


People also ask

How do I make popups with Openlayers?

Click on the map to get a popup. The popup is composed of a few basic elements: a container, a close button, and a place for the content. To anchor the popup to the map, an ol/Overlay is created with the popup container.


1 Answers

Properties:

There are properties such as backgroundColor, border, opacity you can set directly.

Have you taken a look at the popupMatrix example?

JQuery:

In case you use jquery, you can reference the DOM Elements by doing:

popup.contentDiv
popup.groupDiv
popup.closeDiv

Reference

CSS:

Yes, and nothing is stopping you from using css like I demonstrate in this example:

http://jsfiddle.net/BLLqB/1/

Conclusion:

The better way is the one which works best for what you're doing. If you see that the available styling properties are not enough, use jQuery or CSS.

like image 73
capdragon Avatar answered Oct 11 '22 05:10

capdragon