PDA

View Full Version : [DUP] Ext.chart.Legend doesn't obey scrollable value provided in config



Dmitry Apanasevich
20 Nov 2012, 11:40 PM
REQUIRED INFORMATION


Ext version tested:

Sencha Touch 2.1.0 GPL


Browser versions tested against:

Chrome 23 (Windows)

Description:

Ext.chart.Legend - "scrollable: false" has no effect


Steps to reproduce the problem:

Create Ext.chart.Legend docked somewhere with "scrollable: false" in config.


The result that was expected:

Ext.chart.Legend should not be scrollable if this is explicitly stated in config.


The result that occurs instead:

Legend is scrollable.


Test Case:

Code (modified version of http://docs.sencha.com/touch/2-1/#!/guide/drawing_and_charting-section-6 code):




var cmp = Ext.create("Ext.chart.Chart", {
store: {
fields: ['name', 'g1', 'g2', 'g3', 'g4', 'g5'],
data: [
{"name": "Item-0", "g1": 18.341524994680185, "g2": 0.04297258032918805, "g3": 22.351114037029276, "g4": 10.501821959142115, "g5": 18.422488416954124}, {"name": "Item-1", "g1": 2.6795750960073192, "g2": 14.875638789052152, "g3": 0.41991764062895953, "g4": 19.15924362650272, "g5": 1.6495555940993327}, {"name": "Item-2", "g1": 1.9082894708999651, "g2": 5.729225849931112, "g3": 14.809082259901247, "g4": 38.935629377514275, "g5": 2.7729804343737}, {"name": "Item-3", "g1": 21.372004559042896, "g2": 2.131323680889345, "g3": 12.98075950737056, "g4": 63.8279558143009, "g5": 18.852890370148263}, {"name": "Item-4", "g1": 2.678644589238747, "g2": 8.533478458163483, "g3": 4.442247207672851, "g4": 87.39642008886551, "g5": 27.236700916073737}, {"name": "Item-5", "g1": 18.22581616728662, "g2": 4.6238789653695616, "g3": 8.266150112323874, "g4": 97.63735394909592, "g5": 34.37480220555298}, {"name": "Item-6", "g1": 28.511145638423226, "g2": 12.432353979532314, "g3": 28.6741228261814, "g4": 108.2977419283445, "g5": 47.84666069220649}, {"name": "Item-7", "g1": 34.43620878689124, "g2": 4.400807521399271, "g3": 9.897771308372459, "g4": 127.27483400942947, "g5": 36.90075111658946}, {"name": "Item-8", "g1": 21.65297419507408, "g2": 13.873965184960143, "g3": 5.442452028141574, "g4": 112.4995128779431, "g5": 16.29340203114538}, {"name": "Item-9", "g1": 12.982003004868435, "g2": 35.44230021285489, "g3": 16.375689050647726, "g4": 135.54558258822468, "g5": 16.789054656397266}, {"name": "Item-10", "g1": 22.966357646171907, "g2": 38.70605529653733, "g3": 18.15839081425259, "g4": 114.96437921865811, "g5": 8.512883775942063}, {"name": "Item-11", "g1": 0.4961773512983534, "g2": 51.906332843946664, "g3": 19.982581780133525, "g4": 95.0096628034602, "g5": 9.69666590645371}, {"name": "Item-12", "g1": 20.871287522024215, "g2": 62.07049642190715, "g3": 25.96145180733678, "g4": 87.79060021422934, "g5": 3.1888208090676873}, {"name": "Item-13", "g1": 25.10282655149528, "g2": 78.46673576692024, "g3": 26.04466591703436, "g4": 91.54713327066283, "g5": 12.412469961213306}, {"name": "Item-14", "g1": 16.879928748894088, "g2": 56.800978947642236, "g3": 1.3917379459365016, "g4": 71.78792090708514, "g5": 16.54836327119026}, {"name": "Item-15", "g1": 31.831917729546152, "g2": 35.07601255548843, "g3": 25.844745424414132, "g4": 93.52833383209733, "g5": 2.671401561125716}, {"name": "Item-16", "g1": 44.11346876157489, "g2": 23.027433139122376, "g3": 46.411196237286674, "g4": 106.58174110647265, "g5": 2.277851404192951}, {"name": "Item-17", "g1": 40.670861391890135, "g2": 23.5440618568825, "g3": 56.71228987546458, "g4": 114.62825504295904, "g5": 26.280211845137366}, {"name": "Item-18", "g1": 55.6065040501508, "g2": 1.5722659966184906, "g3": 77.43817238547803, "g4": 130.08908094416222, "g5": 12.23868295330551}, {"name": "Item-19", "g1": 46.07941778348976, "g2": 10.21326337003686, "g3": 60.41723272409542, "g4": 125.57289205728488, "g5": 3.455769238542464}, {"name": "Item-20", "g1": 61.593189686585355, "g2": 3.0287808932196434, "g3": 62.962364348922236, "g4": 116.50437959216974, "g5": 19.021231015303968}, {"name": "Item-21", "g1": 49.131662515684056, "g2": 17.359720612610033, "g3": 81.85955411171707, "g4": 104.35194501037188, "g5": 38.019468830156185}, {"name": "Item-22", "g1": 38.505053519952455, "g2": 9.397924777062864, "g3": 64.1364369949548, "g4": 89.23287654726165, "g5": 62.22153503719187}, {"name": "Item-23", "g1": 56.45625324619134, "g2": 32.961040643270024, "g3": 72.43948657468295, "g4": 67.10892520115654, "g5": 80.64986971100456}, {"name": "Item-24", "g1": 37.22410682076297, "g2": 45.05562961930172, "g3": 57.567780112761504, "g4": 45.04615762614276, "g5": 100.00207932829655}, {"name": "Item-25", "g1": 31.942472041872094, "g2": 67.8029444580495, "g3": 53.55223417785279, "g4": 36.91141400902115, "g5": 79.66745070976023}, {"name": "Item-26", "g1": 27.389579901973637, "g2": 51.55427314558277, "g3": 60.697297359605265, "g4": 47.301868053483474, "g5": 89.06330678114135}, {"name": "Item-27", "g1": 21.76700657982844, "g2": 69.1534159811903, "g3": 78.94435417727888, "g4": 25.332426000355156, "g5": 109.82473177890374}, {"name": "Item-28", "g1": 37.76452404604049, "g2": 63.21592972099229, "g3": 91.7883116482889, "g4": 21.77618381260634, "g5": 108.62547474389665}, {"name": "Item-29", "g1": 22.15574281743333, "g2": 80.02333316902416, "g3": 98.08010371357004, "g4": 19.28224399835162, "g5": 123.46698354865038}
]
},
animate: false,
interactions: ['panzoom'],
series: [
{
type: 'line',
xField: 'name',
yField: 'g1',
title: 'Line1',
style: {
lineWidth: 2,
stroke: 'rgba(0,40,170,0.7)'
}
},
{
type: 'line',
xField: 'name',
yField: 'g2',
title: 'Line2',
style: {
lineWidth: 2,
stroke: 'rgba(80,40,170,0.7)'
}
},
{
type: 'line',
xField: 'name',
yField: 'g3',
title: 'Line3',
style: {
lineWidth: 2,
stroke: 'rgba(180,40,170,0.7)'
}
}
],
axes: [
{
type: 'numeric',
position: 'left',
grid: true
},
{
type: 'category',
position: 'bottom',
grid: true,
visibleRange: [0, 0.5]
}
]
});
Ext.Viewport.add({
layout: 'fit',
items: [
{
xtype: 'legend',
docked: 'left',
width: 90,
scrollable: false
},
{
xtype: 'legend',
docked: 'right',
width: 90,
scrollable: false
},
{
xtype: 'legend',
docked: 'top',
scrollable: false
},
{
xtype: 'legend',
docked: 'bottom',
scrollable: false
},
cmp
]
});
var legends = Ext.ComponentQuery.query('legend');
legends[0].setStore(cmp.getLegendStore());
legends[1].setStore(cmp.getLegendStore());
legends[2].setStore(cmp.getLegendStore());
legends[3].setStore(cmp.getLegendStore());


HELPFUL INFORMATION


Screenshot or Video:

none


Debugging already done:

none


Possible fix:

not provided


Additional CSS used:

only default sencha-touch.css


Operating System:

Windows

Workaround:

disable scrolling after legend creation: legend.setScrollable({ disabled: true })

mitchellsimoens
21 Nov 2012, 7:54 AM
http://www.sencha.com/forum/showthread.php?246910

Will be part of ST 2.1.1