2017-08-10 4 views
2

Je suis en train de sélectionner deux classes comme celui-ci,D3 selectAll plusieurs classes AND ou OR

d3.selectAll(".class1.class2") 

mais cela semble sélectionner un élément à la fois class1 ET class2. Comment puis-je sélectionner un élément par classe avec class1 OU class2 mais les classes ne doivent pas s'exclure mutuellement, donc un élément avec les deux classes doit également être sélectionné.

Peut-être que la solution est juste,

d3.selectAll(".class1") 
.........; 
d3.selectAll(".class2") 
.........; 

Répondre

4

Comme par D3 de documentation les méthodes de sélection acceptent W3C selector strings. Si vous suivez ce lien et creusez dans cette API vous vous retrouvez à la section 4.1 Selector Lists du Selectors Niveau 4 Projet qui spécifie:

Une liste séparée par des virgules sélecteurs représente l'union de tous les éléments sélectionnés par chacun des les sélecteurs individuels dans le selector list.

Pour votre exemple, cela signifie que la chaîne de sélection correcte serait ".class1,.class2". Jetez un oeil à l'extrait suivant qui utilise cette chaîne de sélection pour colorer tous les paragraphes ayant l'une ou l'autre des classes class1 ou class2.

d3.selectAll(".class1,.class2") 
 
    .style("color", "red");
<script src="https://d3js.org/d3.v4.js"></script> 
 

 
<p class="class1">class1</p> 
 
<p class="class2">class2</p> 
 
<p class="class3">class3</p> 
 
<p class="class1 class2">class1 class2</p>

0

Cela semble fonctionner,

d3.selectAll(".bar||.xAxisText")