PDA

View Full Version : Charts with smaller points



falto
16 Oct 2009, 4:28 AM
Hello,

I'm using ExtJs charts, and i wanted to know if it's possible to get smaller dot (or points, i don't know how you say for that in english). Because I have a lot of datas, and the points are to big.

Thanks a lot
Thoma

jay@moduscreate.com
16 Oct 2009, 4:43 AM
Yes, you need to customize the way the chart looks by means of the chart "extraStyles".

Each series, you can specify a "style" config object, which you can set size.

falto
16 Oct 2009, 4:57 AM
Okay, so I should do something like this :



var store = new Ext.data.JsonStore({
fields:champs,
data: tableau
});



// more complex with a custom look
new Ext.Panel({
iconCls:'chart',
title: titre_chart,
frame:true,
renderTo: nom_div,
width:373,
height:250,
layout:'fit',

items: {
xtype: 'columnchart',
store: store,
itemCls: 'required',
url:'js/extJS/resources/charts.swf',
xField: xvaleur,
yAxis: new Ext.chart.NumericAxis({
displayName: yvaleur,
setMin:6000,
labelRenderer : Ext.util.Format.numberRenderer('0,0')
}),
tipRenderer : function(chart, record, index, series){
if(series.yField == yvaleur){
return Ext.util.Format.number(record.data.datee, '0,0') + ' visits in ' + record.data.quote;
}
},
chartStyle: {
padding: 2,
animationEnabled: true,
font: {
name: 'Tahoma',
color: 0x444444,
size: 8
},
dataTip: {
padding: 25,
border: {
color: 0x99bbe8,
size:1
},
background: {
color: 0xDAE7F6,
alpha: .9
},
font: {
name: 'Tahoma',
color: 0x15428B,
size: 10,
bold: true
}
},
xAxis: {
color: 0x69aBc8,
majorTicks: {color: 0x69aBc8, length: 8},
minorTicks: {color: 0x69aBc8, length: 4},
majorGridLines: {size: 1, color: 0xeeeeee}
},
yAxis: {
color: 0x69aBc8,
majorTicks: {color: 0x69aBc8, length: 8},
minorTicks: {color: 0x69aBc8, length: 4},
majorGridLines: {size: 1, color: 0xdfe8f6}
}
},
series: [{
type: 'line',
displayName: 'Page Views',
yField: yvaleur,
style: {
size:50%,
color:0x596e7a /*sert a changer la couleur du graphe lui mm*/
}
}]
}
});
});

jay@moduscreate.com
16 Oct 2009, 4:59 AM
it's not relative, but absolute.

*do not* set the chartStyle on the configuration object. set "extraStyle" instead.

and please, for the love of god, use Code tags when posting your code.

falto
16 Oct 2009, 5:51 AM
Okay,
Sorry for the code tags, I didn't saw them.

I did it, thank you,

But i have an other problem, under IE7, the charts take at less one minutes to build, and you can't do anything on IE7 during this time.

Is it normal ? (In fact, there's not just one, but nine charts loading).

Thank you

jay@moduscreate.com
16 Oct 2009, 6:08 AM
does a chart on a vanilla page take that long?

falto
16 Oct 2009, 6:20 AM
what is a vanilla page

jay@moduscreate.com
16 Oct 2009, 6:49 AM
Sorry. That is an american expression meaning "Clean"

falto
16 Oct 2009, 8:31 AM
Well no,

Even if it's longer than on Firefox or Chrome, it don't take 1minute,

I will look what can make take this time.

Thanks a lot for your answers.