PDA

View Full Version : Line chart is not rendering large data points correctly



amitkmehra
22 Jun 2015, 10:42 AM
There is a line chart in our application that shows hourly level aggregated data for a single month, but user can choose to see minute level data. So that leads to a need to plot a maximum of 44,640 data points on a line chat but the charting API is averaging out the data on chart. In attached example I am generating only 3000 data points as 0,1,2,30,1,2,3. But the chart line is plotting values at 1.5 tick rather than on 0,1,2,3 respectively. The line drops down further on the ticks as the number of data points increases or in some cases different results are coming. Please help us solve this issue. Below is the generated output. 52712
Code is

var loopData=[];
for(var i=4;i<3000;i++){
loopData.push({ 'name': 'one', 'data1': i%4});
}
var store = Ext.create('Ext.data.JsonStore', {
fields: ['name', 'data1'],
data: loopData
});

Ext.create('Ext.chart.Chart', {
renderTo: Ext.getBody(),
width: 700,
height: 400,
animate: true,
store: store,
axes: [
{
type: 'Numeric',
position: 'left',
fields: ['data1'],
title: 'Sample Values',
grid: true,
minimum: 0
},
{
type: 'Category',
position: 'bottom',
fields: ['name'],
title: 'Sample Metrics'
}
],
series: [
{
type: 'line',
highlight: {
size: 7,
radius: 7
},
axis: 'left',
xField: 'name',
yField: 'data1',
markerConfig: {
type: 'circle',
size: 4,
radius: 4,
'stroke-width': 0
}
}
]
});

tristan.lee
22 Jun 2015, 1:18 PM
What version of Ext are you using?

amitkmehra
22 Jun 2015, 6:08 PM
I am using ExtJS version 4.2.2
But on jsfiddle they have till 4.2.0 so can't give live example but the points are plotted at 1.5 there also.

tristan.lee
25 Jun 2015, 11:51 AM
This is likely too much for Ext 4 charts to handle. It appears the limit is a max of 1249 records. 1250 breaks your chart. If you need support for large datasets in charts, you will need to migrate to Ext 5/6.

polarberry
22 Jul 2015, 4:01 AM
Hi.

What is the maximum number of data points that a chart widget (line,scatter series) can display in ExtJs 5?

Given a cart with height: 400 and width:300, how many datapoints can it possibly display? Is there a way to determine that?

Thanks!

tristan.lee
22 Jul 2015, 6:05 AM
In 5, I don't know that there is a set limit. If you do find that you reach an upper limit in 5, please create a thread in the 5.x forums so we can work to resolve it.