Wie erhalte ich ein onClick-Ereignis im Blasendiagramm?

Question

Ich versuche ein onlick Ereignis auf einer Blase in der Blasendiagramm zu fangen. Ich möchte das Label der angeklickten Blase in der Konsole protokollieren. Ich habe eine Funktion geschrieben, um die Arbeit zu tun, die dies tatsächlich aussehen

$("#myChart").click(function(evt) { 
    var activePoints = myBubbleChart.getElementAtEvent(evt); 
    console.log(activePoints.label); 
}); 

Jedes Mal, wenn ich auf einer Blase klicken diese Funktion „undefiniert“ in der Konsole anmeldet. Ich habe sogar versucht getBarsAtEvent und getSegmentsAtEvent keiner von ihnen arbeitete. Was ist falsch in meinem Code? Und kann mir bitte jemand sagen, wie kann ich den Label-Wert von Bubble bekommen, auf den ich geklickt habe?

Answer 1

Chart.js Optionen eine eingebaute in onClick Eigenschaft haben (siehe documentation).

Es funktioniert wie folgt:

options: { 
    onClick: function(e) { 
     var element = this.getElementAtEvent(e); 

     // If you click on at least 1 element ... 
     if (element.length > 0) { 
      // Logs it 
      console.log(element[0]); 

      // Here we get the data linked to the clicked bubble ... 
      var datasetLabel = this.config.data.datasets[element[0]._datasetIndex].label; 
      // data gives you `x`, `y` and `r` values 
      var data = this.config.data.datasets[element[0]._datasetIndex].data[element[0]._index]; 
     } 
    } 
} 

prüfen this jsFiddle für ein volles Beispiel.