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 – using ol.interaction.Draw to share new information on the Web


To be able to do a basic save, we have developed a server-side script based on Node.js, a software platform for scalable server-side and networking applications. For the client side, the code will be more classical.

  1. Install Node and NPM, an executable to manage Node.js library dependencies if you don't already have it, using https://github.com/joyent/node/wiki/installation#installing-without-building.

  2. Next, retrieve the index.js and package.json files from the code from upcoming_url and put them in the ol3_samples directory.

  3. Install the dependencies from the command line firing from the ol3_samples folder path, as follows:

    npm install
  4. Download also the file features.geojson into ol3_samples/assets/data/.

  5. Try if the server side works by firing the node index.js and opening http://localhost:3000/features.geojson. You should see something like the following:

    {type: "FeatureCollection", features: [ ]}
  6. Create a new file 2360_08_07_create_new_content...