O'Reilly logo

OpenLayers Cookbook by Antonio Santiago Perez

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Adding markers to the map

Markers are widely used in web mapping applications. They allow us to quickly identify points of interest (POI) by showing an icon at the desired place.

This recipe shows how to add markers to our maps by using the OpenLayers.Marker and OpenLayers.Layer.Markers classes.

Adding markers to the map

How to do it...

  1. Start by creating an HTML page with dependencies on the OpenLayers library. Add the div element that will hold the map:
    <!-- Map DOM element --> <div id="ch3_markers" style="width: 100%; height: 100%;"></div> Create the map instance, add a base layer and a layer switcher control: <!-- The magic comes here --> <script type="text/javascript"> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required