Time For Action – applying some basic Styling

Applying styles is pretty easy, as you'll see:

1. We'll be doing a few things in this example. First, we'll create a vector layer. Then, we'll add some features to it. Nothing new so far. Then, we'll style the layer by creating a StyleMap and Style object and applying them to the vector layer.

2. Add a WMS layer to the map (like in previous chapters) then create and add a vector layer to the map:

   vector_layer = new OpenLayers.Layer.Vector('Basic Vector Layer');
   map.addLayer(vector_layer);

3. Let's add some feature points. We'll create a loop which will create ten randomly placed feature objects and add them to the vector layer. These coordinates will be different each time you refresh the page, as they are being randomly generated:

   for(var i=0; i<10; i++){
       vector_layer.addFeatures([new OpenLayers.Feature.Vector(
           new OpenLayers.Geometry.Point( 
               (Math.floor(Math.random() * 360) - 180),
               (Math.floor(Math.random() * 180) ...