Modifier les valeurs affichées au survol dans le sunbirst

[davy39]

Mettre en forme l'affichage de l'infobulle (tooltip) lors du survol d'une section du sunburst.

Domaine : Pédagogie Activité : Documentation Type : Livres Libellé : Livres pour l'atelier NSI Date : 23/10/2023 Montant : 156,70€

Pour cela modifier le code javascript contenu dans le template sunburst.html :

• Le style de l'affichage est dans le code ci dessous. Surement est-il possible de passer le style dans un fichier CSS en attribuant un id ou une classe au tooltip.

          //Ajouter des tooltips
          var tooltip = d3.select("body")
            .append("div")
            .style("position", "absolute")
            .style("background", "#fff")
            .style("border", "1px solid #ddd")
            .style("padding", "5px")
            .style("visibility", "hidden");

• Le contenu du tooltip est actuellement donné par le code suivant :

           // Ajout des infobulles sur les segments
path.on("mouseover", function (event, d) {
    const ancestors = d.ancestors().map(d => d.data.name).reverse().join("/");
    const value = format(d.value);
    tooltip.html(`${ancestors}<br>${value}`)
      .style("visibility", "visible"); 

[davy39]

C'est fait !