6. Creating webmap using QGIS and Openlayers
6.1. Compose your map in QGIS
- Compose the style of your map using Layer Properties for each vector layer. The example image below shows the Locations point layer as small green circles, while the Province layer shows a graduated color (yellow to red) for the number of sites for each province polygon.
- Disable all other layers except the Locations and Province. These are the only layers we need for our webmap.
6.2. Create a webmap using OGR2Layers plugin
- Open the OGR2Layers plugin window by clicking Plugins > OGR2Layers Plugin > OGR2Layers.
- In the OGR2Layers QGIS tab, click Browse and create a new directory for the Output directory. Use eagle_webmap as your Output directory
- Click the Openlayers tab. In the Map Title, type PH Eagle Sites. Select 800 x 600 as your Map Size.
- Click the Options tab. Select QGIS render as a Render option. Select query one feature as a Query option. Leave all other options unmarked.
- Click OK and then Close when the operation is complete.
6.3. View your webmap
- In your file manager, open the eagle_webmap directory. The directory should contain three files:
- index.html - the webmap html
- Locations.GeoJSON - Locations vector layer in GeoJSON format
- Province.GeoJSON - Province vector layer in GeoJSON format
- Open the index.html in your web browser.