PDA

View Full Version : Series hiding issue



nawin.muttineni@gmail.com
16 Jul 2013, 10:25 PM
Hello all,
I have a chart with multiple series. By default i would like to hide some series for this i use the following function.


Ext.each(myChart.series.items, function(series) {
if (series.yField != "line1" && series.yField != "line2" && series.yField != "line5") {
// hides the series
series.toggleAll(false);
}
});






While using this function, for the first time they are not hiding and from the second time they are hiding.
When the series are hidden the symbols in the legend are being disappear.

Can any one please help me to hide the series without effecting the legend.

hare i am attaching the legend image..

44906

slemmon
18 Jul 2013, 3:38 PM
You might look at hideAll() and showAllO instead:
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.chart.series.Series-method-hideAll
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.chart.series.Series-method-showAll

nawin.muttineni@gmail.com
18 Jul 2013, 8:59 PM
The is no change in behavior even i use series.hideAll() method

slemmon
19 Jul 2013, 2:05 PM
I was using the below as a test case. No good?



var store = Ext.create('Ext.data.JsonStore', {
fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
data: [
{ 'name': 'metric one', 'data1': 10, 'data2': 12, 'data3': 14, 'data4': 8, 'data5': 13 },
{ 'name': 'metric two', 'data1': 7, 'data2': 8, 'data3': 16, 'data4': 10, 'data5': 3 },
{ 'name': 'metric three', 'data1': 5, 'data2': 2, 'data3': 14, 'data4': 12, 'data5': 7 },
{ 'name': 'metric four', 'data1': 2, 'data2': 14, 'data3': 6, 'data4': 1, 'data5': 23 },
{ 'name': 'metric five', 'data1': 4, 'data2': 4, 'data3': 36, 'data4': 13, 'data5': 33 }
]
});


var chart = Ext.create('Ext.chart.Chart', {
renderTo: Ext.getBody(),
legend: true,
width: 500,
height: 300,
animate: true,
store: store,
axes: [
{
type: 'Numeric',
position: 'left',
fields: ['data1', 'data2'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
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: 'cross',
size: 4,
radius: 4,
'stroke-width': 0
}
},
{
type: 'line',
highlight: {
size: 7,
radius: 7
},
axis: 'left',
fill: true,
xField: 'name',
yField: 'data2',
markerConfig: {
type: 'circle',
size: 4,
radius: 4,
'stroke-width': 0
}
}
]
});


Ext.widget('button', {
renderTo: document.body,
text: 'Show/Hide Series 1',
enableToggle: true,
toggleHandler: function (btn, pressed) {
var series = chart.series.first();
if (pressed) {
series.hideAll();
} else {
series.showAll();
}
}
});