Book Image

OpenLayers 3: Beginner's Guide

By : Thomas Gratier, Paul Spencer, Erik Hazzard
Book Image

OpenLayers 3: Beginner's Guide

By: Thomas Gratier, Paul Spencer, Erik Hazzard

Overview of this book

<p>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.</p> <p>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.</p>
Table of Contents (22 chapters)
OpenLayers 3 Beginner's Guide
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Time for action – MANIFEST destiny


Let's take the MANIFEST file out for a spin with our mobile example. The first thing we need to do is decide which resources we want to be included in our application cache and which we want to be excluded. Our application is pretty simple, so we won't need to exclude anything. So, here's what we will do:

  1. Open a text editor and create a new file. Save it as myapp.appcache next to your example's HTML file.

  2. Determine which files to include in the cache. You can do this in several ways, but the easiest is to load your page into a web browser and look at the Network tab. Here's how your screen looks when the Network tab is pressed:

    The first six lines are files requested directly by our application, and the remainder are map tiles loaded from the OpenStreetMap server. We'll explicitly cache the first six in our example.

  3. Add the following lines to the file:

    CACHE MANIFEST
    # version 1
    CACHE:
    2360OS_10_04_appcache.html
    ../assets/ol3/ol.css
    ../assets/css/samples.css...