Ext js 7现代图表动态系列缺失数据
Ext js 7 modern chart dynamic series missing data
我有一个动态 sencha ext js 7.3.1 图表,其中包含来自 json 的动态生成系列,如下所示:
"data": {
"2017": {
"Jahr": "2017",
"data1": "0.00",
"data2": "0.00",
"data3": "80.40",
"data4": "415.00",
"data5": "0.00"
},
"2018": {
"Jahr": "2018",
"data6": "89.00",
"data2": "175.20",
"data4": "440.00"
},
"2019": {
"Jahr": "2019",
"data1": "56.40",
"data4": "440.00",
"data5": "81.60"
},
"2020": {
"Jahr": "2020",
"data6": "94.00",
"data4": "450.00",
"data5": "82.80"
}
},
"series": {
"0": "data3",
"1": "data4",
"2": "data6",
"3": "data2",
"5": "data1",
"7": "data5"
}
当我生成图表并像这样对转换进行系列更新时:
var chart = Ext.getCmp('home-stats');
for(x = 0; x < chart._series.length; x++)
{
chart.removeSeries(chart._series[x].id);
}
var objSeries = Object.values(data.series);
for(x = 0; x < objSeries.length; x++)
{
var serie =
{
type: 'bar',
axis: 'left',
xField: 'Jahr',
yField: objSeries[x],
title: objSeries[x],
stacked: true,
};
chart.addSeries(serie);
}
我实际上缺少 2017 年的数据,我不知道为什么。
这是一个有效的 fiddle:
https://fiddle.sencha.com/#view/editor&fiddle/3cb7
问题是条没有堆叠。我在下一个 fiddle 中更正了您的代码以解决问题:
https://fiddle.sencha.com/#view/editor&fiddle/3cbd
修改在store.js:
var objSeries = Object.values(data.series);
chart.setSeries([{
type: 'bar',
xField: 'Jahr',
yField: objSeries,
title: objSeries,
stacked: true,
style: {
minGapWidth: 15
},
tooltip: {
renderer: function (tooltip, model, item) {
tooltip.setHtml(item.record.get('Jahr') + ' ' + item.field + ' ' + Ext.util.Format.currency(model.get(item.field), '€', 2, true, ' '));
}
}
}]);
我有一个动态 sencha ext js 7.3.1 图表,其中包含来自 json 的动态生成系列,如下所示:
"data": {
"2017": {
"Jahr": "2017",
"data1": "0.00",
"data2": "0.00",
"data3": "80.40",
"data4": "415.00",
"data5": "0.00"
},
"2018": {
"Jahr": "2018",
"data6": "89.00",
"data2": "175.20",
"data4": "440.00"
},
"2019": {
"Jahr": "2019",
"data1": "56.40",
"data4": "440.00",
"data5": "81.60"
},
"2020": {
"Jahr": "2020",
"data6": "94.00",
"data4": "450.00",
"data5": "82.80"
}
},
"series": {
"0": "data3",
"1": "data4",
"2": "data6",
"3": "data2",
"5": "data1",
"7": "data5"
}
当我生成图表并像这样对转换进行系列更新时:
var chart = Ext.getCmp('home-stats');
for(x = 0; x < chart._series.length; x++)
{
chart.removeSeries(chart._series[x].id);
}
var objSeries = Object.values(data.series);
for(x = 0; x < objSeries.length; x++)
{
var serie =
{
type: 'bar',
axis: 'left',
xField: 'Jahr',
yField: objSeries[x],
title: objSeries[x],
stacked: true,
};
chart.addSeries(serie);
}
我实际上缺少 2017 年的数据,我不知道为什么。
这是一个有效的 fiddle: https://fiddle.sencha.com/#view/editor&fiddle/3cb7
问题是条没有堆叠。我在下一个 fiddle 中更正了您的代码以解决问题:
https://fiddle.sencha.com/#view/editor&fiddle/3cbd
修改在store.js:
var objSeries = Object.values(data.series);
chart.setSeries([{
type: 'bar',
xField: 'Jahr',
yField: objSeries,
title: objSeries,
stacked: true,
style: {
minGapWidth: 15
},
tooltip: {
renderer: function (tooltip, model, item) {
tooltip.setHtml(item.record.get('Jahr') + ' ' + item.field + ' ' + Ext.util.Format.currency(model.get(item.field), '€', 2, true, ' '));
}
}
}]);