Converting Msstackedcolumn2Dlinedy To Zoomline Chart

[Karthik87.mit]

Hello all,

 

I am currently using MSStackedColumn2DLineDY charts to display trends. I now wish to move to ZoomLine charts. I have downloaded the chart and had changed the name also.

 

Currently my chart data is,

 

<chart plotSpacePercent='40' palette="2" useRoundEdges='1' plotGradientColor='' bgColor='ffffff' exportShowMenuItem='1' exportEnabled='1' exportHandler='/export/FusionCharts/saveChartAsImage/' exportAtClient='0' exportCallback='widgets.trends_main.widgetImageCompletedCallback' showFCMenuItem='0' bgAlpha='100' borderThickness='0' showBorder='0' canvasBorderThickness='0' canvasBgColor='ffffff' showValues='0' decimals='0' showSecondaryLimits='0' showDivLineSecondaryValue='0' adjustDiv='1' PyAxisMaxValue='50' SyAxisMaxValue='50' SyAxisMinValue='-10' pyAxisName='Satisfaction (Scale -100 to 100)' labelDisplay='rotate' slantLabels='1' baseFontSize='11' baseFontColor='333333' toolTipBgColor='cccccc' legendBgAlpha='100' alternateHGridAlpha="5" showAlternateHGridColor="1" legendBgColor='f0f3ed' legendShadow='0' connectNullData="1"><styles> <definition> <style name='myStrAxisFont' type='font' size='11' color='333333' bold='0'/> <style name='mySltAxisFont' type='font' size='11' color='222222' bold='0'/></definition> <application> <apply toObject='yAxisName' styles='myStrAxisFont'/> <apply toObject='DataLabels' styles='mySltAxisFont'/> </application></styles><!--<chart palette='2' caption='Country Comparison' shownames='1' showvalues='0' decimals='0' numberPrefix='$' useRoundEdges='1' legendBorderAlpha='0'> --><categories> <category label='Feb 2011' /> <category label='Mar 2011' /> <category label='Apr 2011' /> <category label='May 2011' /> <category label='Jun 2011' /> <category label='Jul 2011' /> <category label='Aug 2011' /> <category label='Sep 2011' /> <category label='Oct 2011' /> <category label='Nov 2011' /> <category label='Dec 2011' /> <category label='Jan 2012' /></categories><lineset alpha='90' showPlotBorder='1' seriesName='Satisfaction (My Brand)' color='333333'> <set value='36' toolText='Satisfaction (My Brand), Feb 2011, 36'/> <set value='35' toolText='Satisfaction (My Brand), Mar 2011, 35'/> <set value='33' toolText='Satisfaction (My Brand), Apr 2011, 33'/> <set value='35' toolText='Satisfaction (My Brand), May 2011, 35'/> <set value='36' toolText='Satisfaction (My Brand), Jun 2011, 36'/> <set value='38' toolText='Satisfaction (My Brand), Jul 2011, 38'/> <set value='38' toolText='Satisfaction (My Brand), Aug 2011, 38'/> <set value='38' toolText='Satisfaction (My Brand), Sep 2011, 38'/> <set value='34' toolText='Satisfaction (My Brand), Oct 2011, 34'/> <set value='41' toolText='Satisfaction (My Brand), Nov 2011, 41'/> <set value='39' toolText='Satisfaction (My Brand), Dec 2011, 39'/> <set value='37' toolText='Satisfaction (My Brand), Jan 2012, 37'/> </lineset><lineset alpha='90' showPlotBorder='1' seriesName='Satisfaction {% trans "(Regression Score)"}' color='888888'> <set value='None' toolText='Satisfaction (Regression Score), Feb 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), Mar 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), Apr 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), May 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), Jun 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), Jul 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), Aug 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), Sep 2011, None'/> <set value='None' toolText='Satisfaction (Regression Score), Oct 2011, None'/> <set value='41' toolText='Satisfaction (Regression Score), Nov 2011, 41'/> <set value='39' toolText='Satisfaction (Regression Score), Dec 2011, 39'/> <set value='37' toolText='Satisfaction (Regression Score), Jan 2012, 37'/> </lineset><lineset alpha='90' showPlotBorder='1' seriesName='Satisfaction {% trans "(Comp API Score)"}' color='121212'> <set value='36' toolText='Satisfaction (Comp API Score), Feb 2011, 36'/> <set value='35' toolText='Satisfaction (Comp API Score), Mar 2011, 35'/> <set value='33' toolText='Satisfaction (Comp API Score), Apr 2011, 33'/> <set value='35' toolText='Satisfaction (Comp API Score), May 2011, 35'/> <set value='36' toolText='Satisfaction (Comp API Score), Jun 2011, 36'/> <set value='38' toolText='Satisfaction (Comp API Score), Jul 2011, 38'/> <set value='38' toolText='Satisfaction (Comp API Score), Aug 2011, 38'/> <set value='38' toolText='Satisfaction (Comp API Score), Sep 2011, 38'/> <set value='34' toolText='Satisfaction (Comp API Score), Oct 2011, 34'/> <set value='41' toolText='Satisfaction (Comp API Score), Nov 2011, 41'/> <set value='39' toolText='Satisfaction (Comp API Score), Dec 2011, 39'/> <set value='37' toolText='Satisfaction (Comp API Score), Jan 2012, 37'/> </lineset><lineset alpha='90' showPlotBorder='1' seriesName='Satisfaction (Comp Set)' color='FF9933'> <set value='34' toolText='Satisfaction (Comp Set), Feb 2011, 34' /> <set value='36' toolText='Satisfaction (Comp Set), Mar 2011, 36' /> <set value='34' toolText='Satisfaction (Comp Set), Apr 2011, 34' /> <set value='33' toolText='Satisfaction (Comp Set), May 2011, 33' /> <set value='35' toolText='Satisfaction (Comp Set), Jun 2011, 35' /> <set value='38' toolText='Satisfaction (Comp Set), Jul 2011, 38' /> <set value='38' toolText='Satisfaction (Comp Set), Aug 2011, 38' /> <set value='36' toolText='Satisfaction (Comp Set), Sep 2011, 36' /> <set value='37' toolText='Satisfaction (Comp Set), Oct 2011, 37' /> <set value='37' toolText='Satisfaction (Comp Set), Nov 2011, 37' /> <set value='35' toolText='Satisfaction (Comp Set), Dec 2011, 35' /> <set value='32' toolText='Satisfaction (Comp Set), Jan 2012, 32' /> </lineset>

<dataset> <dataset alpha='90' showPlotBorder='1' seriesName='Satisfaction (Highly Satisfied)' color='53c062'> <set value='39' toolText='Satisfaction (Highly Satisfied), Feb 2011, 39' link='j-widgets.trends_main.handleChartClick-134' /> <set value='40' toolText='Satisfaction (Highly Satisfied), Mar 2011, 40' link='j-widgets.trends_main.handleChartClick-135' /> <set value='39' toolText='Satisfaction (Highly Satisfied), Apr 2011, 39' link='j-widgets.trends_main.handleChartClick-136' /> <set value='38' toolText='Satisfaction (Highly Satisfied), May 2011, 38' link='j-widgets.trends_main.handleChartClick-137' /> <set value='42' toolText='Satisfaction (Highly Satisfied), Jun 2011, 42' link='j-widgets.trends_main.handleChartClick-138' /> <set value='43' toolText='Satisfaction (Highly Satisfied), Jul 2011, 43' link='j-widgets.trends_main.handleChartClick-139' /> <set value='42' toolText='Satisfaction (Highly Satisfied), Aug 2011, 42' link='j-widgets.trends_main.handleChartClick-140' /> <set value='41' toolText='Satisfaction (Highly Satisfied), Sep 2011, 41' link='j-widgets.trends_main.handleChartClick-141' /> <set value='38' toolText='Satisfaction (Highly Satisfied), Oct 2011, 38' link='j-widgets.trends_main.handleChartClick-142' /> <set value='46' toolText='Satisfaction (Highly Satisfied), Nov 2011, 46' link='j-widgets.trends_main.handleChartClick-143' /> <set value='44' toolText='Satisfaction (Highly Satisfied), Dec 2011, 44' link='j-widgets.trends_main.handleChartClick-144' /> <set value='42' toolText='Satisfaction (Highly Satisfied), Jan 2012, 42' link='j-widgets.trends_main.handleChartClick-145' /> </dataset> <dataset alpha='90' showPlotBorder='1' seriesName='Satisfaction (Dissatisfied)' color='b73642'> <set value='-3' toolText='Satisfaction (Dissatisfied), Feb 2011, -3' link='j-widgets.trends_main.handleChartClick-134' /> <set value='-5' toolText='Satisfaction (Dissatisfied), Mar 2011, -5' link='j-widgets.trends_main.handleChartClick-135' /> <set value='-6' toolText='Satisfaction (Dissatisfied), Apr 2011, -6' link='j-widgets.trends_main.handleChartClick-136' /> <set value='-3' toolText='Satisfaction (Dissatisfied), May 2011, -3' link='j-widgets.trends_main.handleChartClick-137' /> <set value='-6' toolText='Satisfaction (Dissatisfied), Jun 2011, -6' link='j-widgets.trends_main.handleChartClick-138' /> <set value='-5' toolText='Satisfaction (Dissatisfied), Jul 2011, -5' link='j-widgets.trends_main.handleChartClick-139' /> <set value='-4' toolText='Satisfaction (Dissatisfied), Aug 2011, -4' link='j-widgets.trends_main.handleChartClick-140' /> <set value='-3' toolText='Satisfaction (Dissatisfied), Sep 2011, -3' link='j-widgets.trends_main.handleChartClick-141' /> <set value='-4' toolText='Satisfaction (Dissatisfied), Oct 2011, -4' link='j-widgets.trends_main.handleChartClick-142' /> <set value='-5' toolText='Satisfaction (Dissatisfied), Nov 2011, -5' link='j-widgets.trends_main.handleChartClick-143' /> <set value='-5' toolText='Satisfaction (Dissatisfied), Dec 2011, -5' link='j-widgets.trends_main.handleChartClick-144' /> <set value='-5' toolText='Satisfaction (Dissatisfied), Jan 2012, -5' link='j-widgets.trends_main.handleChartClick-145' /> </dataset> <dataset alpha='1' showPlotBorder='0' color='FFFFFF'> <set value='-6' toolText='Satisfaction (Dissatisfied), Feb 2011, -3' /> </dataset> </dataset> </chart>

But when i use ZoomLine chart, am not able to see these data. Should i make any other change??? I use chart.setDataURL() to set the XML data.

Please help me with this as i am stuck on this issue.

Thanks,

Karthik

[Guest Bindhu]

Hi,

 

Thank you for the post.

 

The XML structure for ZoomLine chart is different from the XML structure of MSStackedColumn2DLineDY chart.

 

Please modify the XML structure in order to suit the ZoomLine chart structure.

 

Please find attached the modified XML file to suit the ZoomLine chart.

 

Also, find attached the screenshot of the chart rendered.

 

For more information on 'Zoom Line Chart Specification Sheet ', please refer to the link below,

http://docs.fusionch...S/ZoomLine.html

 

Hope this helps !

 

Happy FusionCharting

Zoom.xml

Edited January 13, 2012 by Bindhu

[Karthik87.mit]

Thanks for your immediate reply.

 

Am attaching my original chart.

 

The <lineset> options in the XML file are necessary to produce the trend lines as seen in the chart. Are't they possible in ZoomLine Chart.

 

Thanks,

Karthik

Hi,

 

Thank you for the post.

 

The XML structure for ZoomLine chart is different from the XML structure of MSStackedColumn2DLineDY chart.

 

Please modify the XML structure in order to suit the ZoomLine chart structure.

 

Please find attached the modified XML file to suit the ZoomLine chart.

 

Also, find attached the screenshot of the chart rendered.

 

For more information on 'Zoom Line Chart Specification Sheet ', please refer to the link below,

http://docs.fusionch...S/ZoomLine.html

 

Hope this helps !

 

Happy FusionCharting

[Guest Angshu]

Hi,

 

Thanks for your response.

 

As stated earlier, the XML structure for ZoomLine chart is different from the XML structure of MSStackedColumn2DLineDY chart.

 

Ref: http://docs.fusionch...L/ZoomLine.html

 

Using the <trendLines> element (and children <line> elements), you can define trend lines on the ZoomLine chart.

 

Trend lines are horizontal/vertical lines spanning the chart canvas which aid in interpretation of data with respect to some pre-determined value. For example, if you are plotting sales data of current year, you might want to add previous year's average monthly sales as trend indicator for ease of comparison.

 

For each trend line on the chart, you need to define a <line> element under <trendLines> element as under:

 

<trendLines>

<line startValue='895' color='FF0000' displayValue='Average' />

</trendLines>

 

Please find the screenshot attached for your reference.

 

Hope this helps.

[Karthik87.mit]

That made things a bit clear.

 

One more doubt, are the data points on the zoom line chart clickable?

 

Any event will be triggered if i click on the individual data points on the chart based on which i can do some calculations??

 

Thanks,

Karthik

Hi,

 

Thanks for your response.

 

As stated earlier, the XML structure for ZoomLine chart is different from the XML structure of MSStackedColumn2DLineDY chart.

 

Ref: http://docs.fusionch...L/ZoomLine.html

 

Using the <trendLines> element (and children <line> elements), you can define trend lines on the ZoomLine chart.

 

Trend lines are horizontal/vertical lines spanning the chart canvas which aid in interpretation of data with respect to some pre-determined value. For example, if you are plotting sales data of current year, you might want to add previous year's average monthly sales as trend indicator for ease of comparison.

 

For each trend line on the chart, you need to define a <line> element under <trendLines> element as under:

 

<trendLines>

<line startValue='895' color='FF0000' displayValue='Average' />

</trendLines>

 

Please find the screenshot attached for your reference.

 

Hope this helps.

[Guest Angshu]

Hi,

 

Thanks for your response.

 

Please note that FusionCharts is a data visualization tool and it does not support any calculations, as of now.

 

You would need to write your own code in order to suffice your requirement.

 

FusionCharts JavaScript class API provides a number of events.

 

To know about various events, please refer to the link: http://docs.fusioncharts.com/charts/?JavaScript/API/Events.html

 

Hope this helps.

[Karthik87.mit]

Hello,

 

Am aware of the fact that FusionCharts is a data visualization tool.

 

But my doubt is whether ZoomLine charts supports click event on the data points. Like, when i click on the data point will some events be generated?

 

Thanks,

Karthik

Hi,

 

Thanks for your response.

 

Please note that FusionCharts is a data visualization tool and it does not support any calculations, as of now.

 

You would need to write your own code in order to suffice your requirement.

 

FusionCharts JavaScript class API provides a number of events.

 

To know about various events, please refer to the link: http://docs.fusionch...API/Events.html

 

Hope this helps.

[Guest Angshu]

Hi,

 

Thanks for your response.

 

I am afraid, ZoomLine chart does not support click events on data points, as of now.

 

Hope this helps.