Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
timer SALE ENDS IN
0 Days
:
00 Hours
:
00 Minutes
:
00 Seconds
Arrow up icon
GO TO TOP
Data Visualization with D3 and AngularJS

You're reading from   Data Visualization with D3 and AngularJS Build dynamic and interactive visualizations from real-world data with D3 on AngularJS

Arrow left icon
Product type Paperback
Published in Apr 2015
Publisher
ISBN-13 9781784398484
Length 278 pages
Edition 1st Edition
Languages
Tools
Arrow right icon
Authors (2):
Arrow left icon
 Hanchett Hanchett
Author Profile Icon Hanchett
Hanchett
 Körner Körner
Author Profile Icon Körner
Körner
Arrow right icon
View More author details
Toc

Table of Contents (11) Chapters Close

Preface 1. The Magic of SVG, D3.js, and AngularJS 2. Getting Started with D3.js FREE CHAPTER 3. Manipulating Data 4. Building a Chart Directive 5. Loading and Parsing Data 6. Drawing Curves and Shapes 7. Controlling Transitions and Animations 8. Bringing the Chart to Life with Interactions 9. Building a Real-time Visualization to Monitor Server Logs Index

Selecting and modifying DOM elements

D3.js provides a variety of functions to manipulate elements of the DOM tree, such as setting their attributes, changing their content, creating new elements, or removing them. As you learned in the first chapter, instead of looping through elements and modifying them one by one, with D3.js, we are applying transformations in a declarative way directly to an array of elements. We call the object that stores all the elements in an array a Selection.

To extract such an array of elements from the DOM tree, D3.js offers the d3.selectAll(selector) function to select all elements of a specific type and the d3.select(selector) function to select just a single element. While both functions return a Selection that contains an array of elements, the latter function returns an array with solely a single element.

To tell D3.js which elements we want to select, we use so-called CSS selectors (these are the standard CSS selectors that most developers are already familiar...

You have been reading a chapter from
Data Visualization with D3 and AngularJS
Published in: Apr 2015
Publisher:
ISBN-13: 9781784398484
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 R$50/month. Cancel anytime
Modal Close icon
Modal Close icon