D3 créer des boutons à partir d'un tableau de chaînes contenant des noms

Question

Je voudrais créer plusieurs boutons en d3. afin d'avoir un code plus clair, je voudrais ajouter leurs noms dans un tableau.

J'ai le code suivant, mais il ne fonctionne pas:

var buttonNames = ["button 1", "button 2", "button 3", "button 4"] 

d3.select("body").selectAll("input").data(buttonNames).enter().append("input").attr("type","button").attr("class","button").attr("value", function d(){return d;}) 

Merci d'avance pour votre réponse.

Answer 1

Il y a une faute de frappe dans la définition de votre fonction.

.attr("value", function d(){return d;}) 

devrait être

.attr("value", function (d){return d;}) 

Notez que d est un argument à la fonction et doit être à l'intérieur des parenthèses.

Answer 2

Voici comment je crée plusieurs boutons.

d3.select("#some_id") 
     .append("div") 
     .attr("class","some_other_id") 
     .each(function(d) { 

    for (var i = 1; i < number_to_duplicate; i++) { 
     d3.select("#some_other_id") 
      .append("button") 
      .attr("type","button") 
      .attr("class","btn-btn") 
      .attr("id",function(d) { return 'button '+i;}) 
      .append("div") 
      .attr("class","label") 
      .text(function(d) { return 'button '+i;}) 

Je crée un div et un .each (fonction). Dans la fonction, la boucle for crée les boutons. Cela me donne autant de boutons que je veux - number_to_duplicate - chacun avec un identifiant individuel. Bien sûr, je peux modifier cela et faire plus de boutons, avec des attributs égaux ou différents, en les ajoutant à un autre élément yet_another_id.

Les étiquettes pourraient être faites en dehors de la boucle ailleurs si désiré. Ceci est la «fabrique de boutons» de mon pauvre homme. S'il vous plaît commenter avec critique, positif ou négatif - pour moi d'apprendre.