O'Reilly logo

OpenLayers 2.10 by Erik Hazzard

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Time for Action – styling controls

Let's work with styling some OpenLayers controls. We won't be creating a theme here; instead, we'll just link to an external CSS file which will overwrite the default styles of the elements we wish to style.

  1. Let's start off with creating a new page. We're going to also put all our custom styles in a file called control_style.css. So, whenever we add a style, be sure to put it in the control_style.css. Also, make sure to include the CSS file in the <head> section with:
    <link rel='stylesheet' href='control_style.css' />
  2. Now, let's create our map object. We'll specify the controls array when we instantiate it since we do not want the PanZoombar control in this example. We also are not using a custom theme (we are just ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required