2017-10-12 1 views
0

Sur ma carte avec Chart.js, j'ai une annotation créée avec l'annotation chartjs-plugin. Je voudrais que l'étiquette d'annotation soit visible en survolant la ligne. Mais je ne peux pas le faire fonctionner. J'ai le code suivant:Les événements d'annotation ne mettent pas à jour le graphique

//define ChartOneData 
var ctx = document.getElementById("chart").getContext("2d"); 

var chartOne = new Chart(ctx, { 
    type: 'line', 
    data: chartOneData, 
    options: { 
     annotation: { 
      events: ["mouseenter", "mouseleave"], 
      annotations: [{ 
       type: 'line', 
       mode: 'vertical', 
       scaleID: 'x-axis-0', 
       value: 1, 
       label: { 
        enabled: false, 
        content: "Text Label", 
       }, 
       onMouseenter: function(e) { 
        var element = this; 
        element.options.label.enabled = true; 
        element.chartInstance.update(); 
       }, 
       onMouseleave: function(e) { 
        var element = this; 
        element.options.label.enabled = false; 
        element.chartInstance.update(); 
       }] 
      } 
     } 
    } 
} 

Le feu des événements et changer l'attribut « permis » (visible dans le test de la console), mais le tableau et visuels, ne mettent pas à jour. En fait, je reçois l'erreur dans la console:

Unable to preventDefault inside passive event listener invocation. 
dispatcher @ chartjs-plugin-annotation.js:261 

Je ne comprends pas, quelqu'un peut-il aider?

Répondre

0

Il s'est avéré que c'était un problème avec le branchement sous-jacent. Le code était correct et fonctionnait avec les versions chart.js 2.5 et 2.6 mais pas avec 2.7. Un problème a été ajouté au référentiel github du tableau-annotations.

La solution était de rétrograder à 2.6 et attendre une solution dans la prochaine version de charts.js