PDA

View Full Version : How can I hide null value in a Line chart?



warreninbjcn
26 Jul 2012, 10:22 PM
Can anyone please help me on this?

A am expecting to get a line chart (together with a stacked column chart) that accepts null values but ignores them while drawing them (neither zero nor other random values, just display nothing with null values), but what I get is shown as below. I am expecting the line chart shall have only Jan to Mar data points, since Apr and May are null.

37529
I am doing this with following codes, as you can see I am using "connectDiscontinuousPoints" (both true and false) style, but didn't work.



var store = Ext.create('Ext.data.JsonStore', {
fields: ['t', 'd1', 'd2', 'd3'],
data: [
{ 't': 'Jan-12', 'd1': 1, 'd2': 5, 'd3': 10 }
, { 't': 'Feb-12', 'd1': 2, 'd2': 4, 'd3': 12 }
, { 't': 'Mar-12', 'd1': 3, 'd2': 3, 'd3': 13 }
, { 't': 'Apr-12', 'd1': 4, 'd2': 2, 'd3': null }
, { 't': 'May-12', 'd1': 5, 'd2': 1, 'd3': null }
]
});


Ext.application({
name: 'HelloExt',
launch: function () {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
theme: 'Base',
items: [
{
xtype: 'chart'
, store: store
, axes: [
{
type: 'Numeric'
, position: 'left'
, fields: ['d1', 'd2', 'd3']
, title: 'Values'
, minimum: 0
}
, {
type: 'Category'
, position: 'bottom'
, fields: ['t']
, title: 'time'
}
]
, series: [
{
type: 'column'
, axis: 'left'
, stacked: true
, xField: 't'
, yField: ['d1', 'd2']
}
, {
type: 'line'
, axis: 'left'
, xField: 't'
, yField: 'd3'
, style: {
connectDiscontinuousPoints: false
}
}
]
}
]
});
}
});

scottmartin
27 Jul 2012, 10:05 AM
Try using undefined:



, { 't': 'Apr-12', 'd1': 4, 'd2': 2, 'd3': undefined }
, { 't': 'May-12', 'd1': 5, 'd2': 1, 'd3': undefined }


Scott.

imcvay
25 Sep 2012, 5:36 PM
The store still has null values and these get plotted off the top of the chart