Réglage de Highcharts de la Série et la Catégorie de données dynamiquement

Im essayant de mettre à jour un tableau par le biais d'un appel AJAX en utilisant le code suivant

$j(document).ready(function () {
$j("#filter").click(function () {
BuildReport();
});
$j("#container").highcharts({
chart: {
type: 'column',
marginRight: 130,
marginBottom: 100
},
title: {
text: 'SEs open by Group',
x: -20 //center
},
yAxis: {
title: {
text: ''
},
min: 0,
allowDecimals: false
},
xAxis: {},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>' +
'Total: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
cursor: 'pointer',
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: {}
});
BuildReport();
});
function SetChartSeries(series) {
debugger;
chart = $j("#container").highcharts();
chart.xAxis[0].setCategories(getReportCategories(series));
chart.series = $j.map(series, function (item) {
return {
name: item.Name,
color: item.Colour,
data: $j.map(item.Items, function (list) {
return {
name: list.Category,
y: list.Value,
id: list.ID
};
})
};
});
}
function getReportCategories(data) {
var catArray = [];
$j.each(data, function (index, value) {
$j.each(value.Items, function (index, value) {
if ($j.inArray(value.Category, catArray)) {
catArray.push(value.Category);
}
});
});
return catArray;
}
function BuildReport() {
$j.ajax({
url: "ChartDataHandler.ashx",
dataType: "json",
cache: false,
success: function (data) {
SetChartSeries(data.Series);
}
});
}

Lorsque le chargement de la page ou le filtre bouton est cliqué BuildReport appelle le gestionnaire et transmet les données de la série à SetChartSeries. À partir d'ici je peux voir que le tableau des propriétés, mais le tableau n'est jamais établi. Je fais évidemment quelque chose de mal?

Avez-vous essayé de changer la méthode AJAX à la POSTE?
Bien qu'il ne semble pas être le problème. Les données revient bien à partir de l'appel AJAX. Auparavant, j'étais la création du graphique avec la série et catégorie de propriétés dans le gestionnaire de succès de l'appel ajax et cela a bien fonctionné, mais serait plutôt juste de créer le graphique une fois et ensuite mettre à jour les catégories et les données de la série avec chaque nouvel appel ajax
J'ai eu quelques maux de tête, jusqu'à ce que j'ai compris un peu plus comment Highcharts œuvres. Peut-être redessiner le graphique? le graphique.redraw()
Utilisation chart.addSeries(object) lors de la création graphique, et chart.series[index].setData(array) lors de la configuration de vos données. chart.series = .. ne pas faire n'importe quoi.

OriginalL'auteur Stewart Alan | 2013-04-25

highcharts jquery

1

Si vous souhaitez créer une nouvelle série, vous devez utiliser Le graphique.addSeries() méthode

Si vous souhaitez définir de nouvelles données dans une série déjà existante, vous devez utiliser De la série.setData()
méthode.

Comme je vois, vous créez de nouvelles séries pour chaque demande et de l'utilisation addSeries méthode

OriginalL'auteur Cihad Turhan
0

Si vous souhaitez définir la catégorie de données de façon dynamique, vous devez utiliser de l'Axe.méthode update ()
```
chart.xAxis[0].update({categories:arrayname,tickInterval:20},true);
```
OriginalL'auteur Swetha
0

La suivante est ce que j'ai fait la mise à jour dynamique de la série. Le comportement par défaut, retrace le graphique. Vérifier https://api.highcharts.com/class-reference/Highcharts.Chart#update
```
$('#YourContainer').highcharts().update( {
series:[{
name: 'New Legend',
data: [{
name: 'New Category',
y: data
}]
]}
})
```
OriginalL'auteur Edison Chang

Vous devez vous connecter pour publier un commentaire.