Learning D3.js Mapping

Thomas Newton, Oscar Villarreal

• Publisher: Packt Publishing
• Year: 2014
• eBook ISBN: 9781783985609
• Edition: 1
• Topic: Computer Science
• Subtopic: Data Modelling & Design
• Index: Computer Science

D3.js is a visualization library used for the creation and control of dynamic and interactive graphical forms. It is a library used to manipulate HTML and SVG documents based on data. A consolidated resource on obtaining geographic data, modifying it to your convenience, and visualizing it with augmented data using D3.js, this book will meet your mapping needs.

Starting with a working map, you will explore the tools required to start the construction process, further moving on to cover the fundamentals of SVG and understanding its relation to creating maps using D3. Equipped with this overview, you will learn to make optimum use of D3's mapping, covering the main enter, update, and exit methods that allow D3.js to do its magic. Dealing with data joining and pairing with HTML and SVG, you will be introduced to different aspects of GEO data, along with the common file formats and converting data into GeoJSON and TopoJSON. You will learn to apply interactivity to your maps and create stunning visualizations before  finally ensuring problem-free development with a chapter on troubleshooting.

Learning D3.js Mapping

---

Table of Contents

Learning D3.js Mapping

Credits

About the Authors

About the Reviewers

www.PacktPub.com

Support files, eBooks, discount offers, and more

Why subscribe?

Free access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Gather Your Cartographer's Toolbox

Quick bootstrap

Step-by-step bootstrap

A lightweight web server

Optimizing geographic data files with TopoJSON

Using the web browser as a development tool

Installing the sample code

Working with the developer tools

Summary

2. Creating Images from Simple Text

Introduction – general knowledge

Positioning elements

Line

Rectangle

Circle

Polygon

Path

Experiment

Paths with curves

Transform

Translate

Scale

Grouping

Text

Summary

3. Producing Graphics from Data – the Foundations of D3

Creating basic SVG elements

Enter

Update

Exit

AJAX

Summary

4. Creating a Map

Foundation – creating your basic map

Including the dataset

Experiment 1 – adjusting the bounding box

Experiment 2 – creating choropleths

Experiment 3 – adding click events to our visualization

Experiment 4 – using updates and transitions to enhance our visualization

Experiment 5 – adding points of interest

Experiment 6 – adding visualizations as a point of interest

Summary

5. Click-click Boom! Applying Interactivity to Your Map

Events and how they occur

Experiment 1 – hover events

Experiment 2 – tooltips with visualizations

Experiment 3 – panning and zooming

Experiment 4 – orthographic projections

Experiment 5 – rotating orthographic projections

Experiment 6 – dragging orthographic projections

Summary

6. Finding and Working with Geographic Data

GeoData file types

What are shapefiles and how do I get them?

Acquiring shapefiles for a specific country

GeoJSON

A quick map in D3 with only GeoJSON

TopoJSON basics

TopoJSON command-line tips

Preserving specific attributes

Simplification

Merging files

Summary

7. Testing

Code organization and reusable assets

Project structure

Exploring the code directory

Other administrative files

Writing testable code

Keeping methods/functions small

Preventing side effects

An example with viz.js

Unit testing

Creating resilient visualization code

Adding a new test case

Summary

Index

Learning D3.js Mapping

Copyright © 2014 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the authors, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: December 2014

Production reference: 1221214

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham B3 2PB, UK.

ISBN 978-1-78398-560-9

www.packtpub.com

Credits

Authors

Thomas Newton

Oscar Villarreal

Reviewers

Samrat Ambadekar

Brendon Parker

Alex Rothenberg

Claudio Squarcella

Arjun Srinivasan

David Suther

Commissioning Editor

Ellen Bishop

Acquisition Editor

Rebecca Youé

Content Development Editor

Arun Nadar

Technical Editor

Pankaj Kadam

Copy Editors

Karuna Narayanan

Vikrant Phadkay

Project Coordinator

Neha Bhatnagar

Proofreaders

Simran Bhogal

Stephen Copestake

Ameesha Green

Indexer

Mariammal Chettiyar

Graphics

Abhinash Sahu

Production Coordinator

Arvindkumar Gupta

Cover Work

Arvindkumar Gupta

About the Authors

Thomas Newton has 20 years of experience in the technical industry, working on everything from low-level system designs and data visualization to software design and architecture. Currently, he is creating data visualizations to solve analytical problems for clients. When he is free, he spends as much time as possible with his family, ideally with a skateboard involved.

Oscar Villarreal has been developing interfaces for the past 10 years, and most recently, he has been focusing on data visualization and web applications. In his spare time, he loves to write on his blog, oscarvillarreal.com, and go rock climbing somewhere in the Rockies. He also loves to spend time with his wife and his first child.

About the Reviewers

Samrat Ambadekar is a user experience designer and prototyper, currently residing in the United States. He holds a Master's degree in Human Computer Interaction from Georgia Institute of Technology, Atlanta, and a Bachelor's degree in Computer Engineering from University of Pune, India. He has over 5 years of experience as a designer and developer, with expertise in rapid prototyping and contextual interactions. His work and interests span across UX design, interaction design, concept prototyping, 3D interactions, augmented reality, and data visualization. Apart from work, he enjoys sketching, blogging, hiking/trekking, cooking, and (occasionally) practicing kickboxing. To know more about his work, visit www.samratambadekar.com.

Alex Rothenberg has been writing software for quite a while on mobile apps, websites, and even shrink-wrapped CD-ROMs. The one constant is that he enjoys finding ways to think about complex problems in simple ways. He has really enjoyed working with D3.js rec...

Table of contents

• Learning D3.js Mapping