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 – switching to JSON data


We mentioned earlier that the Flickr feed API supports more than just the KML format. It also supports a variety of RSS versions and JSON. That sounds promising; let's see if we can do better with the JSON version. Refer to the following steps:

  1. First, replace the KML source, flickrSource, with a generic vector source. Reload the page and make sure that everything still works. You should see the base map but no features (we'll add them shortly):

    var flickrSource = new ol.source.Vector();
  2. Next, we'll need to download the JSON version of our data by changing the format in the URL to json. Load the following URL in your browser and save the result to a new file called flickr_data.json:

  3. Have a look at this file in your text editor. Note that it starts with jsonFlickrFeed (on the first line, this means that it is intended to be loaded as JSONP).

    Note

    JSONP, or JSON with Padding, is a technique...