Mapping With Drupal - Alan Palazzolo [29]
Fullscreen
This provides a button that expands the map to the full size of the user’s browser.
Layer Switcher
Using Views, you can create several layers that show different but related information. When configuring the map, you can enable several such data layers, and several base layers (e.g., a Bing street map and a Google Satellite map). All of these layers will be controlled by a layer-switching widget, and users can turn them on and off.
Cluster
See Browser Capabilities for a description and rationale for clustering. OpenLayers comes with its own JavaScript clustering script. The OpenLayers examples site provides a good demonstration of how to configure this Behavior.
Geolocate
The latest version of the OpenLayers library takes advantage of HTML5 geolocation, as supported by most modern browsers, especially on smartphones and tablets. Users are prompted to allow the web page to access their location; then the map is updated to center on that location. A demonstration is on the OpenLayers examples site. This Behavior was added in version 2.11 of OpenLayers, so if you see the warning, “Dependency not found: OpenLayers.Control.Geolocate,” this is because you are using an older version of the OpenLayers JavaScript library. That can be changed at admin/structure/openlayers.
Creating custom Behaviors is covered in Chapter 5.
Advanced OpenLayers Configuration
On the OpenLayers configuration page at admin/structure/openlayers you may have noticed a setting for where the OpenLayers.js file is located. By default the OpenLayers module will use a JavaScript file hosted on openlayers.org. This works, but in most cases it is better to host the file yourself both for speed and reliability.
Download the latest stable release of the OpenLayers JavaScript library from openlayers.org. Alternatively, you can check out the code from the OpenLayers subversion repository.
Extract the .zip or .tar.gz file to your Drupal site, typically to a libraries directory inside the site’s folder.
Update the OpenLayers configuration in your website at admin/structure/openlayers with the new location of the OpenLayers JavaScript file:sites/all/libraries/OpenLayers-2.10/OpenLayers.js.
While doing the steps above, you may have noticed that the OpenLayers JavaScript library is huge, and the OpenLayers.js file that is loaded to display a map is almost 1 MB. Once you have finished building all of your maps for a site, you can recompile this file to exclude all the Behaviors that are not needed. The library that you downloaded from http://openlayers.org/ contains a Python script and instructions inside the build directory. Further instructions are in the OpenLayers module in docs/CUSTOMIZATION.txt.
Creating an OpenLayers Map Layer from KML
In OpenLayers layers a data layer was created using the Views module. An alternative is to use a static KML file to create the data layer. KML was introduced in Data Types. Using a KML file to generate the data layer will usually be faster than using the Views module because the spatial data does not need to be queried from the database.
Find a KML file that you would like to display on your map; for example the USGS list of the world’s largest earthquakes. Download this file and add it to your site. In this example, we’ve put it inside a custom module called “mappingdrupalexercises.” Because this file will be loaded through JavaScript, most web browsers will block the file if it is not on the same website as the map that you are creating.
From the OpenLayers module’s layers configuration page, add a new layer at admin/structure/openlayers/layers/add.
Click on KML in the list of layer types.
Enter the path of the KML file as the URL: sites/all/modules/custom/mappingdrupalexercises/LargestWorldEarthquakes.kml
Enter an ID for this layer (for example, usgs_earthquakes).
Enter a title and description, then save your new KML layer. It should show up on the list of layers at admin/structure/openlayers/layers.
Follow the instructions in OpenLayers Maps to create