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 – getting dynamic data


In this exercise, we'll change our code to fetch the data from Flickr when the page loads, rather than using a previously downloaded file. As you'll see, this is quite straightforward.

  1. Recall that when we switched over to the static JSON data, we entered the following URL into our browser to download the JSON data:

  2. We should be able to use this URL with our $.ajax function and load data directly from the live feed rather than our static file. Go ahead and modify the URL:

    $.ajax({
      url: 'http://api.flickr.com/services/feeds/geo/?format=json&tags=bird',
      dataType: 'jsonp',
      jsonpCallback: 'jsonFlickrFeed',
      success: successHandler
    });
  3. Reload the browser and you should see different photos loaded than in your saved JSON file.

What just happened?

By simply replacing the URL for our AJAX function with the live Flickr feed URL, we can now load the latest available data. No other changes...