Saltar al contenido

¿Cómo agregar el evento OnClick en las etiquetas en Chart.js v2.0?

Hola usuario de nuestro sitio, hallamos la respuesta a lo que andabas buscando, continúa leyendo y la encontrarás aquí.

Solución:

en chart.js 2.5 (tal vez incluso antes) puede poner un onClick en las opciones:

'legend' : {
    'onClick' : function (evt, item) 
                    console.log ('legend onClick', evt, item);
                ,
    'display' : true,
    'labels' : ...

getElementsAtEvent comprueba solo el principal elementos del gráfico (barras, puntos, sectores…). Si también desea considerar las etiquetas, deberá volver a implementar la funcionalidad para las etiquetas.

La mayor parte del código que necesita ya está disponible en diferentes métodos en el código de la biblioteca Chart.js. Simplemente copie y pegue / limpie como se hace a continuación.


Guion

Su manejador de clics debe ser

$('#myChart').click(function (e) 
    var helpers = Chart.helpers;

    var eventPosition = helpers.getRelativePosition(e, myRadarChart.chart);
    var mouseX = eventPosition.x;
    var mouseY = eventPosition.y;

    var activePoints = [];
    // loop through all the labels
    helpers.each(myRadarChart.scale.ticks, function (label, index) 
        for (var i = this.getValueCount() - 1; i >= 0; i--) 
    , myRadarChart.scale);

    var firstPoint = activePoints[0];
    if (firstPoint !== undefined) 
        alert(firstPoint.index + ': ' + firstPoint.label);
    
);

Violín – http://jsfiddle.net/1Lngmtz7/

Reseñas y puntuaciones del tutorial

Si tienes algún cuestión o disposición de reaccionar nuestro ensayo te recordamos escribir una reseña y con deseo lo estudiaremos.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *