Définir des données supplémentaires sur la série de graphiques en haut

Question

Existe-t-il un moyen de transmettre des données supplémentaires à l'objet de la série qui s'afficheront dans le graphique 'info-bulle'?

par exemple

  tooltip: {
     formatter: function() {
               return '<b>'+ this.series.name +'</b><br/>'+
           Highcharts.dateFormat('%b %e', this.x) +': '+ this.y;
     }
 

Ici, nous ne pouvons utiliser que series.name, this.x & this.y à la série. Disons que je dois transmettre une autre valeur dynamique seule avec le jeu de données et pouvoir y accéder via un objet de série. Est-ce possible?

Merci d'avance à tous.

Answer 1

Oui, si vous configurez l'objet de la série comme suit, où chaque point de données est un hachage, vous pouvez transmettre des valeurs supplémentaires:

 new Highcharts.Chart( {
   ...,
   series: [{
         name: 'Foo',
         data: [ { y : 3, myData : 'firstPoint' },
                 { y : 7, myData : 'secondPoint' },
                 { y : 1, myData : 'thirdPoint' } ]
      }]
} );
 

Dans votre info-bulle, vous pouvez y accéder via l'attribut "point" de l'objet transmis:

 tooltip: {
     formatter: function() {
               return 'Extra data: <b>'+ this.point.myData +'</b>';
     }
}
 

Exemple complet ici: http://jsfiddle.net/japanick/dWDE6/314/

Answer 2

De plus, avec cette solution, vous pouvez même mettre plusieurs données autant que vous le souhaitez:

 tooltip: {
    formatter: function () {
        return 'Extra data: <b>' + this.point.myData + '</b><br> Another Data: <b>' + this.point.myOtherData + '</b>';
    }
},

series: [{
    name: 'Foo',
    data: [{
        y: 3,
        myData: 'firstPoint',
        myOtherData: 'Other first data'
    }, {
        y: 7,
        myData: 'secondPoint',
        myOtherData: 'Other second data'
    }, {
        y: 1,
        myData: 'thirdPoint',
        myOtherData: 'Other third data'
    }]
}]
 

Merci Nick.

Answer 3

Juste pour ajouter une sorte de dynamisme:

Fait pour générer des données pour un graphique en histogrammes empilés avec 10 catégories. Je voulais avoir, pour chaque catégorie, 4 séries de données et voulu pour afficher des informations supplémentaires (image,question, de distraction et de la réponse attendue) pour chaque série de données:

<?php 

while($n<=10) { $data1[]=array("y"=>$nber1,"img"=>$image1,"question"=>$ques,"distracteur"=>$distractor1,"reponse"=>$ans); $data2[]=array("y"=>$nber2,"img"=>$image2,"question"=>$ques,"distracteur"=>$distractor2,"reponse"=>$ans); $data3[]=array("y"=>$nber3,"img"=>$image3,"question"=>$ques,"distracteur"=>$distractor3,"reponse"=>$ans); $data4[]=array("y"=>$nber4,"img"=>$image4,"question"=>$ques,"distracteur"=>$distractor4,"reponse"=>$ans); }

//Puis convertir les données en série de données:

$mydata[]=array("nom"=>"Distracteur #1","données"=>$data1,"pile"=>"Distracteur #1"); $mydata[]=array("nom"=>"Distracteur #2","données"=>$data2"pile"=>"Distracteur #2"); $mydata[]=array("nom"=>"Distracteur #3","données"=>$data3,"pile"=>"Distracteur #3"); $mydata[]=array("nom"=>"Distracteur #4","données"=>$data4,"pile"=>"Distracteur #4");

?>

Dans le highcharts section:

var mydata=<? echo json_encode($mydata)?>;

//info-bulle section

info-bulle: { useHTML: true, formateur: function() {

                return 'Question ID: <b>'+ this.x +'</b><br/>'+
                    'Question: <b>'+ this.point.ques +'</b><br/>'+
                   this.series.name+'<br> Total attempts: '+ this.y +'<br/>'+
                    "<img src=\"images/"+ this.point.img +"\" width=\"100px\" height=\"50px\"/><br>"+
                    'Distractor: <b>'+ this.point.distractor +'</b><br/>'+
                    'Expected answer: <b>'+ this.point.answer +'</b><br/>';
            }
        },

//la série section de la highcharts

série: mydata

//Pour la catégorie de l'article, il suffit de préparer un tableau d'éléments et de les affecter à la variable de catégorie comme je l'ai fait sur la série.

Espérons que cela aide quelqu'un.