O'Reilly logo

OpenLayers Cookbook by Antonio Santiago Perez

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

Understanding how themes work using the theme folder

As we have explained in the chapter's introduction, there are some OpenLayers controls strongly based on CSS classes to be the theme.

In this group, we can find the PanPanel control, a small control formed by a set of four buttons that allows the user to pan the map in four directions:

Understanding how themes work using the theme folder

How to do it...

  1. Create an HTML page and add the OpenLayers ibrary dependencies:
    <script type="text/javascript" src="./js/OpenLayers-2.11/lib/OpenLayers.js"></script> 
  2. After this, we need to include the CSS file with the theme to be used. Here we are using the default theme:
    <link rel="stylesheet" href="./js/OpenLayers-2.11/theme/default/style.css" ...

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