D3: modifica delle classi CSS

    



       
    <style>
    .cerchio {
        fill: red;
        stroke: yellow;
        stroke-width: 10px;
        stroke-dasharray: 7, 2;
    }
</style>

<svg>
    <circle cx="60" cy="75" r="40" />
    <circle cx="150" cy="75" r="40" />
</svg>

<script>
    d3.select("circle")
      .classed("cerchio", true)
</script>    
  

  
  .cerchio {
    fill: red;
    stroke: yellow;
    stroke-width: 10px;
    stroke-dasharray: 7, 2;
}

Definisce una regola CSS chiamata “cerchio” con le impostazioni del colore di riempimento e del colore, dello spessore e del tratteggio del contorno.

  d3.select("circle")
  .classed("cerchio", true)

Seleziona il (primo) elemento <circle> e gli assegna la classe cerchio. Con il secondo parametro impostato a false la classe verrebbe tolta se presente.