Les marqueurs de survol manquent sur le graphique déconnecté

Je suis confronté à un problème et je ne suis pas sûr si c'est un bug dans le plugin Highcharts ou une erreur de programmation.

J'utilise des valeurs nulles pour dessiner un graphe linéaire déconnecté avec une seule série, mais il semble qu'il y ait un problème avec les marqueurs pivotants: certains d'entre eux (en haut de la première ligne et en bas de la seconde) semblent ne pas apparaître. Le code est simple mais je ne peux pas trouver ce qui causerait cela.

Voici un exemple qui reproduit le problème: http://jsfiddle.net/KYXQS/9/ (mise à jour le 26/02)

Et voici le code (mis à jour le 26/02):

$(function () { var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'line', marginRight: 130, marginBottom: 25, zoomType: 'xy' }, title: { text: 'Monthly Average Temperature', x: -20 //center }, subtitle: { text: 'Source: WorldClimate.com', x: -20 }, tooltip: { formatter: function() { return '<b>'+ this.series.name +'</b><br/>'+ this.x +': '+ this.y +'°C'; } }, plotOptions : { line : { marker : { enabled: false, } } }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'top', x: -10, y: 100, borderWidth: 0 }, series: [{ name: 'Red', data: [[0,0],[1,1],[2,2] ,null ,[4,4],[5,5],[6,6] ,null ,[2,0],[3,1],[4,2] ,null ,[6,4],[7,5],[8,6] ,null ,[12,0],[13,1],[14,2] ,null ,[16,4],[17,5],[18,6] ,null ,[22,0],[23,1],[24,2] ,null ,[26,4],[27,5],[28,6] ,null ,[32,0],[33,1],[34,2] ,null ,[36,4],[37,5],[38,6] ,null ,[34,0],[35,1],[36,2] ,null ,[38,4],[39,5],[40,6] ,null ,[36,0],[37,1],[38,2] ,null ,[40,4],[41,5],[42,6] ,null ,[40,2],[41,2],[42,3] ,null ,[47,8],[48,10],[49,11] ], color: 'red' } ,{ name: 'Blue', data: [[2,2],[3,3],[4,4] ,null ,[8,8],[9,10],[10,12] ,null ,[4,2],[5,3],[6,4] ,null ,[10,8],[11,10],[12,12] ,null ,[14,2],[15,3],[16,4] ,null ,[20,8],[21,10],[22,12] ,null ,[24,2],[25,3],[26,4] ,null ,[30,8],[31,10],[32,12] ,null ,[34,2],[35,3],[36,4] ,null ,[40,8],[41,10],[42,12] ,null ,[36,2],[37,3],[38,4] ,null ,[42,8],[43,10],[44,12] ,null ,[38,2],[39,3],[40,4] ,null ,[44,8],[45,10],[46,12] ,null ,[42,3],[41,3],[42,4] ,null ,[49,11],[52,12],[53,12] ], color: 'blue' } ,{ name: 'Green', data: [[6,6],[7,7],[8,8] ,null ,[10,12],[11,15],[12,19] ,null ,[8,6],[9,7],[10,8] ,null ,[12,12],[13,15],[14,19] ,null ,[8,6],[9,7],[10,8] ,null ,[12,12],[13,15],[14,19] ,null ,[18,6],[19,7],[20,8] ,null ,[22,12],[23,15],[24,19] ,null ,[28,6],[29,7],[30,8] ,null ,[32,12],[33,15],[34,19] ,null ,[38,6],[39,7],[40,8] ,null ,[42,12],[43,15],[44,19] ,null ,[40,6],[41,7],[42,8] ,null ,[44,12],[45,15],[46,19] ,null ,[42,6],[43,7],[44,8] ,null ,[46,12],[47,15],[48,19] ,null ,[42,4],[45,5],[47,8] ,null ,[53,12],[54,13],[55,14] ], color: 'green' }] }); }); 

});

Une idée sur la façon de faire réapparaître ces marqueurs?

Merci d'avance.

MISE À JOUR 26/02:
J'ai testé d'autres scénarios pour identifier la cause de ce problème et voici ce que j'ai découvert:
– Le problème se produit lorsque les lignes sont trop proches les unes des autres (sur le xAxis)
– Le zoom ne vous aide pas, même le zoom sur l'endroit où le marqueur est censé apparaître ne le fait pas apparaître.
– Le problème se produit chaque fois que les valeurs y sont identiques ou non

MISE À JOUR 25/04: pour un exemple, vous pouvez voir le bug lors de la tentative de survoler le point à [47,15] sur la série verte. Au lieu du point [47,15], c'est le point [47,8] qui est "plané" et tout ce que j'essaie (comme le zoom précisément), je ne peux pas "flotter" le point [47,15].

J'ai mis à jour le lien jsfiddle et le code ci-dessus avec plus d'exemple pour illustrer le problème.

Quelqu'un a-t-il une idée pour résoudre ce problème?

Le problème est que dans Highcharts, les données d'une série doivent être classées en ordre croissant pour xAxis, alors que votre série ne l'est pas. Trier vos données, et devrait fonctionner.

Je suppose que vous ne parlez pas vraiment de marqueurs puisque ceux-ci sont configurés pour

PlotOptions: {line: {marker: {enabled: false,}}},

Dans votre exemple. Si vous souhaitez afficher des marqueurs, vous devrez modifier cela pour permettre: true.

Vous parlez probablement de l'info-bulle à la place.

Ce que vous devez faire, c'est de changer votre code pour:

 tooltip: { shared: true, formatter: function () { var s = '<b>' + this.x + '</b>'; $.each(this.points, function (i, point) { s += '<br/>' + point.series.name + ': ' + point.y + 'm'; }); return s; }, }, 

Voir ces entrées et violons de doc:

http://api.highcharts.com/highcharts#tooltip.shared

http://api.highcharts.com/highcharts#tooltip.formatter

http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/tooltip/formatter-shared/

Bug n'est ni dans les diagrammes élevés ni dans votre programme. Le problème est que certains des marqueurs sont cachés derrière d'autres. Consultez http://jsfiddle.net/msjaiswal/KYXQS/10/ Vous remarquerez qu'au point de connexion des lignes vertes et bleues, les marqueurs bleus sont cachés derrière les verts. Essayez de désélectionner les séries vertes de la légende et les marqueurs bleus cachés apparaîtront.

Activer les marqueurs dans les options de graphique comme ceci:

  line : { marker : { enabled: true, } }