HighCharts modifie dynamiquement le type de graphique

Utilisation de HighCharts 2.2.3 dans un site ASP.NET. Voir http://jsfiddle.net/wergeld/TDLvc/ pour l'exemple de code. L'installation de mon site est un peu différente de ce que montre jsFiddle. Ma fonction de modification de la série existe dans un fichier JS inclus et l'appel à la fonction n'est pas "en ligne" avec le code JS de création de graphique (bien qu'il soit encore enveloppé dans un jquery prêt au document).

J'ai deux problèmes et l'un d'eux peut être vu dans jsFiddle. 1) Lorsque vous modifiez le type de graphique, il semble que la désignation yAxis soit perdue. Vous pouvez voir que j'ai initialement 2 yAxis et après avoir changé le type de graphique, l'axe supérieur n'a plus d'étiquettes de valeurs (signifie que les données du graphique utilisent uniquement l'axe du bas (premier yAxis)). 2) Lorsque vous exécutez ceci sous FF ou IE, j'ai une erreur sur la ligne qui appelle:

data: serie.options.data

L'erreur est: c n'est pas un constructeur Line 55 dans highcharts.js (c'est le fichier min-ed).

En utilisant highcharts.src.js, je peux maintenant voir que l'erreur est: typeClass n'est pas un constructeur

Ceci est en ligne 8789 dans src.js: serie = new typeClass ();

Voir jsFiddle mis à jour: sélectionnez Point comme type de graphique: http://jsfiddle.net/wergeld/nS4Ny/1/ . Cela provoquera cette erreur.

Ce problème est la capitalisation de nos valeurs déroulantes. Changé le contrôle à faire:

 newType = newType.toLowerCase();

Maintenant, le type de graphique change très bien. Code complet:

 function changeType(chart, series, newType) { newType = newType.toLowerCase(); for (var i = 0; i < series.length; i++) { series = series[0]; try { series.chart.addSeries({ type: newType, stack: series.stack, yaxis: series.yaxis, name: series.name, color: series.color, data: series.options.data }, false); series.remove(); } catch (e) { alert(newType & ': ' & e); } } }

Pour quiconque trébuche à travers ça … Vous devez supprimer la série de graphiques de la dernière à la première. N'oubliez pas de redessiner sur la dernière série ou vos modifications ne seront pas affichées 🙂

 function changeChartType(chart, type, redraw) { var seriesOptions = new Array(chart.series.length); for (var i = 0; i < chart.series.length; i++) { var series = chart.series[i]; seriesOptions[i] = { type: type, name: series.name, color: series.color, dashStyle: series.options.dashStyle, lineWidth: series.options.lineWidth, marker: series.options.marker, dataLabels: series.options.dataLabels, enableMouseTracking: series.options.enableMouseTracking, data: series.options.data, isRegressionLine: series.options.isRegressionLine }; } for (var i = chart.series.length - 1; i >= 0; i--) { chart.series[i].destroy(); } for (var i = 0; i < seriesOptions.length; i++) { var newSeries = chart.addSeries(seriesOptions[i], redraw && i == seriesOptions.length - 1); } chart.currentType = type; }