Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Learning D3.js 5 Mapping

You're reading from   Learning D3.js 5 Mapping Build cutting-edge maps and visualizations with JavaScript

Arrow left icon
Product type Paperback
Published in Nov 2017
Publisher
ISBN-13 9781787280175
Length 298 pages
Edition 2nd Edition
Languages
Tools
Arrow right icon
Authors (3):
Arrow left icon
Thomas Newton Thomas Newton
Author Profile Icon Thomas Newton
Thomas Newton
Oscar Villarreal Oscar Villarreal
Author Profile Icon Oscar Villarreal
Oscar Villarreal
Lars Verspohl Lars Verspohl
Author Profile Icon Lars Verspohl
Lars Verspohl
Arrow right icon
View More author details
Toc

Table of Contents (13) Chapters Close

Preface 1. Gathering Your Cartography Toolbox FREE CHAPTER 2. Creating Images from Simple Text 3. Producing Graphics from Data - the Foundations of D3 4. Creating a Map 5. Click-Click Boom! Applying Interactivity to Your Map 6. Finding and Working with Geographic Data 7. Testing 8. Drawing with Canvas and D3 9. Mapping with Canvas and D3 10. Adding Interactivity to Your Canvas Map 11. Shaping Maps with Data - Hexbin Maps 12. Publishing Your Visualization with GitHub Pages

Summary

In this chapter, you have learned how to build a flight path visualization in SVG and in Canvas, bringing together much of what you have learned before. You have seen how it requires a different mental model to program animations with Canvas, probably best summarized by the game loop: process your data, clear the drawing, re-draw the animation. You have used D3 to set up the visualizations, but you have also seen that due to the different coding concept, Canvas might require you to step away a little from D3 core functionality like transitions. However, all that paid off by witnessing the power of Canvas when it comes to animation. Instead of being able to fluidly animate 1,000 points we managed to animate 15,000 points safely and 20,000 points still gracefully with optimized Canvas techniques.

After having seen the benefits of Canvas, let's now find a workaround...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $19.99/month. Cancel anytime
Banner background image