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

Finding the Canvas object under the mouse - Picking

We’ve done zooming and rotating. Let’s celebrate by adding another key piece of interactivity: the mouseover. In fact, we don’t want just any mouseover. We want to mouse over an object drawn on the Canvas and retrieve information from that object. Once we have that, we have a lot—we can create tooltips, we can highlight the object, we can link views with another graph showing the same data point, and so on.

Picking, the theory

So, how are we doing this? As established many times above, we can’t just add a listener to a set of pixels, because an event is an object maintained by the browser, interacting with DOM nodes. However, our browser...

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