Using OpenLayers
The Google Maps API is not the only option to develop a JavaScript mapping application. OpenLayers is one of the oldest and frequently used frameworks. It is an open source project constantly maintained and developed by a growing crowd of enthusiastic developers. As you have noticed, it is used with the GeoServer previews.
The Layer preview uses OpenLayers 2, but the 4.x release has been out for a while. As long as you are building a new mapping application, you should use this release. Although the following examples are basic, they will show you how to incorporate GeoServer data using the WMS protocol.
Integrating GeoServer and OpenLayers
To discover OpenLayers' capabilities, we will start with a simple map interacting with GeoServer WMS as follows:
- Open your text editor and create a new file; we will call it
basemapWMS.html
. As usual, we will start with the basic elements for an HTML file, plus the reference to the OpenLayers library. Paste the following piece of code inside...