Book description
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.
Table of contents
- Title Page
- Copyright
- Credits
- Foreword
- About the Authors
- About the Reviewers
- www.PacktPub.com
- Customer Feedback
- Preface
- Gathering Your Cartography Toolbox
- Creating Images from Simple Text
- Producing Graphics from Data - the Foundations of D3
-
Creating a Map
- Foundation - creating your basic map
- 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
-
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
- Summary
- Finding and Working with Geographic Data
- Testing
- Drawing with Canvas and D3
- Mapping with Canvas and D3
- Adding Interactivity to Your Canvas Map
-
Shaping Maps with Data - Hexbin Maps
- Reviewing map visualization techniques
- Value and use of the hexagon
- Making a hexbin map
- Summary
- Publishing Your Visualization with GitHub Pages
Product information
- Title: Learning D3.js 5 Mapping - Second Edition
- Author(s):
- Release date: November 2017
- Publisher(s): Packt Publishing
- ISBN: 9781787280175
You might also like
book
Practical D3.js
Your indispensable guide to mastering the efficient use of D3.js in professional-standard data visualization projects. You …
book
D3.js 4.x Data Visualization - Third Edition
Create and publish your own interactive and compelling data visualizations with D3.js 4.x About This Book …
book
D3.js: Cutting-edge Data Visualization
Turn your raw data into real knowledge by creating and deploying complex data visualizations with D3.js …
video
Intermediate D3.js
Bolster your skills for creating beautiful, interactive, browser-based data visualizations with the D3 JavaScript library. Ideal …