Learning D3.js 4 mapping : build cutting-edge maps and visualizations with JavaScript / Thomas Newton, Oscar Villarreal, and Lars Verspohl.

Format:

Book

Author/Creator:

Newton, Thomas, author.

Villarreal, Oscar, author.

Verspohl, Lars, author.

Language:

English

Subjects (All):

Information visualization--Computer programs.

Information visualization.

Computer graphics--Computer programs.

Computer graphics.

Physical Description:

1 online resource (1 volume) : illustrations, maps

Edition:

Second edition.

Other Title:

Build cutting-edge maps and visualizations with JavaScript

Learning D3.js four mapping

Place of Publication:

Birmingham, England : Packt Publishing, 2017.

System Details:

text file

Summary:

Crisp and concise guide on building impressive maps as well as visualizations with D3 a JavaScript library About This Book Dive into D3.js and apply its powerful data binding ability in order to create stunning visualizations Learn the key concepts of SVG, JavaScript, CSS and the DOM to bring data and shapes to live in the browser Solve common problems faced while building interactive maps Acquire key web development skills from the creating your interactive to testing and finally publishing it. Who This Book Is For This book is for people with at least a basic knowledge of of web development (basic HTML/CSS/JavaScript). You don't need to have worked with D3.js before. What You Will Learn Work with SVG geometric shapes Learn to manage map data and plot it with D3.js Add interactivity and points of interest to your maps Compress and manipulate geoJSON files with the use of topoJSON Learn how to write testable D3.js visualizations Build a globe with D3.js and Canvas and add interactivity to it. Create a hexbin map with D3.js In Detail 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 as well as the Canvas element based on data. Using D3.js, developers can create interactive maps for the web, that look and feel beautiful. This book will show you how build and design maps with D3.js and gives you great insight into projections, colors, and the most appropriate types of map. The book begins by helping you set up all the tools necessary to build visualizations and maps. Then it covers obtaining geographic data, modifying it to your specific needs, visualizing it with augmented data using D3.js. It will further show you how to draw and map with the Canvas API and how to publish your visualization. By the end of this book, you'll be creating maps like the election maps and the kind of infographics you'll find on sites like the New York Times. Style and approach This step by step guide with pragmatic examples will help you create maps and amazing visualizations.

Contents:

Cover

Title Page

Copyright

Credits

Foreword

About the Authors

About the Reviewers

www.PacktPub.com

Customer Feedback

Table of Contents

Preface

Chapter 1: Gathering Your Cartography Toolbox

Quick bootstrap

Step-by-step bootstrap

A lightweight web server

Using the web browser as a development tool

Installing the sample code

Working with the developer tools

Summary

Chapter 2: Creating Images from Simple Text

The SVG coordinate system

Line

Rectangle

Circle

Polygon

Path

Experiment

Paths with curves

Transform

Translate

Scale

Grouping

Text

Chapter 3: Producing Graphics from Data - the Foundations of D3

Creating basic SVG elements

The enter() function

The update function

The exit() function

Fetch

Chapter 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

Chapter 5: Click-Click Boom! Applying Interactivity to Your Map

Events and how they occur

Experiment 1 - hover events and tooltips

Experiment 2 - tooltips with visualizations

Experiment 3 - panning and zooming

Experiment 4 - orthographic projections

Experiment 5 - rotating orthographic projections

Experiment 6 - dragging orthographic projections

Chapter 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

Simplification

Merging files

Chapter 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

Chapter 8: Drawing with Canvas and D3

Introducing Canvas

Drawing with Canvas

The three drawing steps of every Canvas visual

Drawing various shapes with Canvas

Animating the Canvas

Animating the Canvas way

Getting a general overview

Preparing the rain data

Updating each drop

Drawing frame by frame

Canvas and D3

Getting an overview of our experiment

The data

Binding the data

Drawing the data

Running the app

Chapter 9: Mapping with Canvas and D3

Choosing Canvas or SVG

Reasons to choose SVG

Reasons to choose Canvas

Visualizing flight paths with Canvas and D3

Building the flight path map in SVG

Measuring the performance

Building the flight path map in Canvas

Setting up the map

Drawing the map and listening for user input

Preparing and drawing with Canvas

Drawing the background scene

Defining the planes

Calculating the plane's positions

Animating the plane

Optimizing performance

Continuing with measuring performance

Chapter 10: Adding Interactivity to Your Canvas Map

Why Canvas interaction is different

Drawing the world on a Canvas

Setting up

Drawing the world

Making the world move

Setting up the behavior

Handling zoom and rotation

Finding the Canvas object under the mouse - Picking

Picking, the theory.

Creating all things hidden

Drawing the hidden Canvas

Picking the values

Storing more data and using a lookup array

Highlighting the country on mouse over

Visualizing data per country and adding a tooltip

Adding new data to our old globe

Coloring the globe

Adding a tooltip

The HTML

Building the static parts of the tooltip

Showing and hiding the tooltip

Chapter 11: Shaping Maps with Data - Hexbin Maps

Reviewing map visualization techniques

Choropleth maps

Cartograms

Dot density maps

Value and use of the hexagon

Making a hexbin map

Reviewing the hexbin algorithm

Setting it up

Drawing the map

Drawing a point grid for our hexagons

Keeping only the points within the map

Making the hex tile

Retrieving the hexagon center points

Drawing the hex tiles

Joining data points to the layout points

Dressing our data for the final act

Turning our visual into an interactive app

Adding additional information on hover and click

Changing the hexagon size

Changing the color scale interpolator

Browsing different datasets

Encoding data as hexagon size

Chapter 12: Publishing Your Visualization with GitHub Pages

What we will publish

Understanding the type of content you can publish

Hosting your code on GitHub

Making sense of some key terms and concepts

Tracking historic changes of your files

Collaborating on a project

Working on project branches

Setting up a GitHub account

Creating a repository

Editing a file on GitHub

Uploading files to the repository

Publishing your project on GitHub Pages

Preparing the files for publishing

Keeping your paths absolute

Changing the main HTML filename to index.html

Publishing your project

Index.

Notes:

Includes index.

Description based on online resource; title from PDF title page (EBC, viewed January 3, 2018).

ISBN:

1-78728-425-5

OCLC:

1019685188