OpenLayers 3 Beginner s Guide

OpenLayers 3 Beginner s Guide

Erik Hazzard

Language: English

Pages: 432

ISBN: 1782162364

Format: PDF / Kindle (mobi) / ePub

Get started with OpenLayers 3 and enhance your web pages by creating and displaying dynamic maps

About This Book

  • Create and display maps online with the latest HTML5 features available, using the OpenLayers 3 library
  • Learn how to interact with the map and learn best practices to improve the loading time for a map
  • A practical beginner's guide, which also serves as a quick reference with useful screenshots and detailed code explanations

Who This Book Is For

Whether you are a hobbyist or a professional web developer, if you wish to use maps on your website, then this book is for you. A basic understanding of JavaScript will be helpful, but is not necessary. If you've never worked with maps before, this book will introduce you to some common mapping topics and will guide you through the OpenLayers library. Experienced developers can also use this book as a reference to OpenLayers 3 components and to further enhance their knowledge.

What You Will Learn

  • Build a complete, real-world OpenLayers application optimized for production use
  • Work with different raster data sources to create a base map
  • Overlay vector data sources and work with vector features directly
  • Customize the appearance of vector layers
  • Understand the concept of map projections and how to use them
  • Manage and work with interactions such as click and touch
  • Work with controls to enhance the user experience
  • Target mobile platforms and explore challenges presented by mobile development

In Detail

This book is a practical, hands-on guide that provides you with all the information you need to get started with mapping using the OpenLayers 3 library.

The book starts off by showing you how to create a simple map. Through the course of the book, we will review each component needed to make a map in OpenLayers 3, and you will end up with a full-fledged web map application. You will learn the key role of each OpenLayers 3 component in making a map, and important mapping principles such as projections and layers. You will create your own data files and connect to backend servers for mapping. A key part of this book will also be dedicated to building a mapping application for mobile devices and its specific components.

Content Everywhere

A Practical Guide to Managing Web Projects

CSS Text

Pro HTML5 Programming: Powerful APIs for Richer Internet Application Development












undefined The size property represents the size of the map in pixels. view ol.IView The view property is an instance of a View class that provides the spatial context for the map. We will discuss views at the end of this chapter. target Element | string | undefined The target property is the HTML element that the map is placed into. The value of this property will be the value that you supplied, either an HTML element or a string that is the ID of an HTML element. The layergroup property

input, and the planned place where we want to create this checkbox: function generate_checkbox(id_checkbox, label_name, html_element) { var checkbox = document.createElement('input'); checkbox.type = "checkbox"; = id_checkbox; var label = document.createElement('label'); label.htmlFor = id_checkbox; label.appendChild(document.createTextNode(label_name)); html_element.appendChild(checkbox); html_element.appendChild(label); } 9. Finally, we just need to loop using the layers object