Je souhaiterais appliquer une classe CSS dans une fonction JS. Voici mon code qui affiche une mind map dynamique :
Code : Tout sélectionner
function getData() {
var data = {
"id": 1,
"name": "Animals",
"type": "Root",
"description": "A living organism that feeds on organic matter",
"children": [
{
"id": 2,
"name": "Carnivores",
"type": "Type",
"description": "Diet consists solely of animal materials",
"children": [
{
"id": 3,
... je vous passe toute la suite
}
]
};
return data;
}
var data = getData();
var treePlugin = new d3.mitchTree.boxedTree()
.setData(data)
.setElement(document.getElementById("visualisation"))
.setIdAccessor(function(data) {
return data.id;
})
.setChildrenAccessor(function(data) {
return data.children;
})
.setBodyDisplayTextAccessor(function(data) {
return data.description;
})
.setTitleDisplayTextAccessor(function(data) {
return data.name;
})
.initialize();
Je peux modifier ces classes dans mon CSS mais elle s'appliquent sur toutes mes box. Je souhaiterais que chacune de mes box ait une couleur différente et pouvoir appliqué une classe CSS par box.
J'ai tenté pour tester
Code : Tout sélectionner
document.getElementById("1").style.color = "purple";
Code : Tout sélectionner
"id": 1
Est-il possible de cibler chacun de mes "id" ou tout simplement d'intégrer du CSS directement dans mon JS ?
Si oui, comment ?
Je vous remercie par avance.
Anthony