D3.js tutoriel - Partie 2 - Sélecteurs

d3.select()

D3.js propose deux méthodes simples pour sélectionner des éléments HTML. La premièresult méthode est d3.select(); qui sélectionne le première élément correspondant au sélecteur. Le sélecteur s'écrit en utilisant la meême syntaxe que les sélecteurs CSS. Voici quelques example:

• d3.select('h1'); - sélectionne la première balise <h1> de la page.
• d3.select('#myID'); - sélectionne la première balise avec l'identifiant myId de la page.
• d3.select('.myClass'); - sélectionne la première balise de la classe myClass de la page.

Voici un exemple en de sélection d'éléments :

d3.selectAll()

Vous pouvez aussi sélectionner plusieurs éléments à la fois. C'est le rôle de la fonction d3.selectAll(). Cette fonction fonctionne sur le même principe que la précédente, mais permet de sélectionner plusieurs éléments en une seule fois :

• d3.select('.myClass'); - sélectionne tous les élements de la classe myClass.

Voir aussi

• D3.js tutoriel
• D3.js tutoriel - Partie 1 - Démarrer avec D3.js
• D3.js tutoriel - Partie 3 - Méthodes élémentaires
• D3.js tutoriel - Partie 4 - Method chaining
• D3.js tutoriel - Partie 5 - Créer un SVG et dessiner un cercle
• D3.js tutoriel - Partie 6 - Formes élémentaires
• D3.js tutoriel - Partie 7 - Data binding
• D3.js tutorial - Partie 8 - Diagramme à barres
• D3.js tutorial - Partie 9 - Redimensionner les graphiques
• D3.js tutoriel - Partie 10 - Définir l'échelle avec scale()
• D3.js tutoriel - Partie 11 - Graphiques responsifs
• D3.js tutorial - Partie 12 - Les axes

---