Book Image

OpenLayers 3.x Cookbook - Second Edition

By : Peter J. Langley, Antonio Santiago Perez
Book Image

OpenLayers 3.x Cookbook - Second Edition

By: Peter J. Langley, Antonio Santiago Perez

Overview of this book

OpenLayers 3 is one of the most important and complete open source JavaScript mapping libraries today. Throughout this book, you will go through recipes that expose various features of OpenLayers 3, allowing you to gain an insight into building complex GIS web applications. You will get to grips with the basics of creating a map with common functionality and quickly advance to more complicated solutions that address modern challenges. You will explore into maps, raster and vector layers, and styling in depth. This book also includes problem solving and how-to recipes for the most common and important tasks.
Table of Contents (14 chapters)
OpenLayers 3.x Cookbook Second Edition
About the Authors
About the Reviewer

Listening for mouse or touch events

So far, in this chapter, we've looked at how to respond to events that OpenLayers itself publishes, such as tile load events and vector feature events, such as feature added. However, what about user-driven gestures and interactions with the map? This recipe takes a look at some of these types of events.

We'll demonstrate the click or tap and map panning events. When the user clicks on or touches the map, the geometry and pixel coordinates will be displayed in the sidebar. When the map is panned, the new visible extent of the map will be displayed in the sidebar as well.

The source code can be found in ch04/ch04-mouse-touch-events, and here's a screenshot of what this will look like:

How to do it…

To set up and subscribe to some user-driven events, follow these steps:

  1. Create an HTML file and include the OpenLayers dependencies. In particular, include the div element for the map and the markup for the side panel and content:

    <div id="js-map" class="map"&gt...