D3 Elementi Da Array

    let svg = d3.select("body").append("svg")
            .attr("width",600).attr("height",200)

let radius = [5, 10, 15, 20]

svg.selectAll("circle")
   .data(radius)
   .join("circle")
   .attr("cx", (d, i) => 40 + i * 50)
   .attr("cy", 100)
   .attr("r", d => d)
  

  .attr("cx", (d, i) => 40 + i * 50)

Assegna all’attributo cx una valore calcolato, attraverso una funzione, in base agli argomenti d (il singolo dato, o raggio) e i (indice dell’elemento nell’array). In realtà l’argomento d non viene utilizzato mentre i viene usato per distanziare i cerchi di 50 pixel partendo dalla coordinata 40.

  .attr("r", d => d)

Assegna all’attributo r il dato letto dalla funzione d => d che restituisce direttamente l’argomento ricevuto. Con la sintassi classica l’istruzione sarebbe:

  .attr("r", function(d) { return d })

Aggiungere altri valori all’array, anche non progressivi