How to render Extjs 4 charts into the ExtJs 3 panel .

[mahesh_chavan]

Hi All,

can anybody tell me how to render an ExtJs4 chart into the existing application which is developed using ExtJs 3 library?

[abe.elias]

this might be helpful...

http://dev.sencha.com/deploy/ext-4.0...x/sandbox.html

[mahesh_chavan]

Hi Abie,

Thanks for sharing the link . I have already seen this example in which they have created a window
containing one panel which holds all your charts. However my requirement is to display chart directly into the panel. I have tired with rendering a chart into the window it works fine.

However when i have tired it with the panel it did not work out .is there any difference in rendering the components in ExtJs 3 and ExtJs4 ? please find below my code

var chart = Ext4.create('Ext.chart.Chart', {
width: 400,
height: 400,
animation:true,
store: chartStore,
axes: [
{
title: 'x',
type: 'Numeric',
position: 'bottom',
fields: ['xValue']
},
{
title: 'y',
type: 'Numeric',
position: 'left',
fields: ['yValue']
}
],
series: [
{
type: 'line',
xField: 'xValue',
yField: 'yValue'
}
]
});


var ext3Panel = new Ext.Panel({

title:'Chart in Extjs 3',
layout:'fit',
renderTo:Ext.getBody(),
id:'ext3Panel',
height:400,
width:600,
items:[chart]
});

[scottmartin]

ExtSJ4 is new, different.

You are asking how to slam a new version of code into a older version.
When you buy car parts, do you buy that part that was made for another year and expect it to work?

I would suggest you:
-Use what is provided in ExtJS3
-Use a 3rd party that will work with ExtJS3 (ex: Highcharts)
-Use ExtJS4 and then use the charts.

Regards,
Scott.

[mahesh_chavan]

Hi Scott,

Thanks for the suggestion. I am new to ExtJs 4. I am really impressed by the look and feel of the ExtJs 4.x charts and also a good thing about ExtJs 4 is with sandboxing feature you can use Ext JS 4 packages and components in an existing Ext JS 3.x application. Now just imagine if there is an application which is already developed using ExtJs 3.x and if you want to use new features of ExtJs 4.x then there is no point in migrating your whole application from ExtJs 3.x to ExtJs 4.x.

Is there any difference in rendering ExtJs 3.x and ExtJs 4.x components ?

Regards,
Mahesh.

[scottmartin]

I have not actually tried to use ExtJS4 charts in ExtJS3 apps. I have read several other posts where much time is spent trying to squeeze it in.

I use Hightcharts (HC) in in my ExtJS3 apps. There is a extension that works just fine and it loads without problems.

The other problem with ExtJS4 Charts is that it does not support printing/exporting (HC does) at this time. It makes it a bit of a 'toy' until it is supported.

Regards,
Scott.

[Mycoding]

Maybe it will be helpfull to you to use just raphael
http://raphaeljs.com/.
Cause ExtJS 4 charts is on base of Raphael.
Look at this. I did map of Russia in ExtJS 3 + Raphael
http://vreshenie.ru/work/svg/map/15.html