Using point features as markers

Displaying markers is not only limited to using the OpenLayers.Marker and OpenLayers.Layer.Markers classes.

A marker can be understood as a point of interest (POI) where we place an icon to identify it and has some information associated with it: a monument, a parking area, a bridge, and so on.

In this recipe, we will learn how to use these features with a point geometry type associated to create markers.

How to do it...

1. Once you have created the right HTML file with OpenLayers dependencies, add a div element to hold the map:

   <div id="ch3_feature_markers" style="width: 100%; height: 100%;"></div>

2. Start initializing the map instance and add a base layer and control:

       // Create the map using the specified DOM element
       var map = new OpenLayers.Map("ch3_feature_markers");    
       
       var layer = new OpenLayers.Layer.OSM("OpenStreetMap");
       map.addLayer(layer);
       
       map.addControl(new OpenLayers.Control.LayerSwitcher());
       map.setCenter(new...