Creating features programmatically

Loading data from an external source is not the only way to work with vector layers. Imagine a web-mapping application where the user can create new features on the fly, such as landing zones, perimeters, areas of interest, and so on, and add them to a vector layer with some style. This scenario requires the ability to create and add the features programmatically.

In this recipe, we will take a look at some ways to create a selection of features programmatically. The source code can be found in ch03/ch03-creating-features/. The following screenshot shows some features that are created programmatically:

How to do it…

Here, we'll create some features programmatically, without any file importing. Follow these instructions to find out how this is done:

1. Start by creating a new HTML file with the required OpenLayers dependencies. In particular, add the div element to hold the map:

   <div id="js-map"></div>

2. Create an empty JavaScript...