Problems With Chart

[brunovazdemelo]

Hello, I did one chart and i have 2 problemas, I need chance de circles in te line points to Triangle ou Retangle, and I put the legend in te bottom but i need one legend under the another, because i have 8 lines and only 2 legends stay in my screen.

My Graphic: http://www.vazdemelo.com.br/a.jpg

[MiamiCoder]

You can use the image and mode properties of the series style to change the shape of the data points:

http://www.extjs.com/forum/attachment.php?attachmentid=16530&stc=1&d=1254339015



<script type="text/javascript">
Ext.BLANK_IMAGE_URL = 'ext3/images/default/s.gif';
Ext.chart.Chart.CHART_URL = 'ext3/resources/charts.swf';
Ext.onReady(function() {
var store = new Ext.data.JsonStore({
fields:['name', 'games', 'movies','music'],
data: [
{name:'Jul 07', games: 245, movies: 300, music:700},
{name:'Aug 07', games: 240, movies: 350, music:550},
{name:'Sep 07', games: 355, movies: 400, music:615},
{name:'Oct 07', games: 375, movies: 420, music:460},
{name:'Nov 07', games: 490, movies: 450, music:625},
{name:'Dec 07', games: 495, movies: 580, music:350},
{name:'Jan 08', games: 520, movies: 600, music:605},
{name:'Feb 08', games: 620, movies: 750, music:670}
]
});

// more complex with a custom look
new Ext.Panel({
title: 'Example',
frame:true,
renderTo: 'container',
width:400,
height:300,
layout:'fit',
items: {
id:'chart',
xtype: 'linechart',
store: store,
xField: 'name',
yAxis: new Ext.chart.NumericAxis({
displayName: 'games',
labelRenderer : Ext.util.Format.numberRenderer('0,0')
}),
tipRenderer : function(chart, record, index, series){
if(series.yField == 'games'){
return Ext.util.Format.number(record.data.games, '0,0') + ' games in ' + record.data.name;
}if(series.yField == 'music'){
return Ext.util.Format.number(record.data.games, '0,0') + ' CD\'s in ' + record.data.name;
}
else{
return Ext.util.Format.number(record.data.movies, '0,0') + ' movies in ' + record.data.name;
}
},
chartStyle: {
padding: 10,
animationEnabled: true,
font: {
name: 'Tahoma',
color: 0x444444,
size: 11
},
legend:{
display:'bottom'
},
dataTip: {
padding: 5,
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: 4},
minorTicks: {color: 0x69aBc8, length: 2},
majorGridLines: {size: 1, color: 0xeeeeee}
},
yAxis: {
color: 0x69aBc8,
majorTicks: {color: 0x69aBc8, length: 4},
minorTicks: {color: 0x69aBc8, length: 2},
majorGridLines: {size: 1, color: 0xdfe8f6}
}
},
series: [{
type: 'line',
displayName: 'Movies',
yField: 'movies',
style: {
color:0xCCCCCC,
image:'img/star_red.png',
mode: 'stretch'
}
},{
type:'line',
displayName: 'Games',
yField: 'games',
style: {
color: 0xCCCCCC,
image:'img/star_green.png',
mode: 'stretch'
}
},{
type:'line',
displayName: 'Cd\'s',
yField: 'music',
style: {
color: 0xCCCCCC,
image:'img/star_blue.png',
mode: 'stretch'
}
}]
}
});

});

</script>

[brunovazdemelo]

thanks,

and the problem with legend, do you know how i solve?