Chart Difference - Javascript Renderer And Flash Renderer

[tnz]

Hi,

 

We are trying to make the existing charts on our internal website to work on iPad. But I am facing some problems with Javascript renderer.

 

With the same dataXML, "FusionCharts.setCurrentRenderer('javascript');" renders completely different chart from the default Flash renderer (which renders perfectly). Please see the attachments for differences. Do I have to modify chart settings somewhere else to get the desired result?

 

Here is the DataXML:

 

 

<chart chartLeftMargin='15' chartRightMargin='10' chartTopMargin='5' chartBottomMargin='10' baseFontColor='000000' outCnvBaseFontColor='666666' plotSpacePercent ='17' plotFillRatio='100' showLabels='0' alternateHGridAlpha='0' canvasbgColor='f7f7f7' showPlotBorder='0' bgAlpha='0,0' canvasBorderAlpha='0' showBorder='0' showLegend='0' formatNumberScale='0' adjustDiv='0' yAxisValuesStep='1' yAxisValueDecimals='0' decimals='2' forceDecimals='1' showValues='1' numberPrefix='$' placeValuesInside='1' caption='' yAxisName='' >

<categories>

<category label='AIA' />

<category label='AMP' />

<category label='Asteron' />

<category label='AXA' />

<category label='Fidelity' />

<category label='OnePath' />

<category label='Sovereign' />

<category label='TOWER' />

</categories>

<dataset seriesName='Policy Fee' color='993333'>

<set value='0' showValue='0' />

<set value='0' showValue='0' />

<set value='0' showValue='0' />

<set value='5.74' />

<set value='8.25' />

<set value='6.5' />

<set value='5.46' />

<set value='0' showValue='0' />

</dataset>

<dataset seriesName='Life Cover' color='a9c25b'>

<set value='56' />

<set value='45.18' />

<set value='45.94' />

<set value='36.35' />

<set value='41.7' />

<set value='44.26' />

<set value='35.84' />

<set value='43.33' />

</dataset>

<dataset seriesName='Trauma Cover' color='96784a'>

<set value='38.39' />

<set value='61.03' />

<set value='49.44' />

<set value='49.47' />

<set value='35' />

<set value='38.33' />

<set value='53.69' />

<set value='44.08' />

</dataset>

<dataset seriesName='Income Protection' color='e4d76a'>

<set value='41.26' />

<set value='75.2' />

<set value='39.01' />

<set value='37.01' />

<set value='37.41' />

<set value='42.2' />

<set value='40.22' />

<set value='48.92' />

</dataset>

<styles>

<definition>

<style name='myToolTipFont' type='font' font='Arial' size='12' color='333333'/>

</definition>

<application>

<apply toObject='ToolTip' styles='myToolTipFont' />

</application>

</styles>

</chart>

 

Any help is greatly appreciated.

[Guest Angie]

Hi,

 

Welcome to FusionCharts Forum!

 

Due to technological differences, it is almost impossible to achieve 100% accuracy in visibility between flash and javascript chart.

 

For more details, please refer to the link: http://kb.fusioncharts.com/questions/462/Minimize+visual+and+functional+differences+between+FusionCharts+3.2+JavaScript+and+Flash+charts

 

Hope this helps.

[tnz]

Thanks a lot for your reply. I was just trying to get the column width and data label position right.

 

The Highcharts reference helped a lot.

 

plotOptions: {

series: {

groupPadding: 0.05

}

}

dataLabels: {

y: 10

}

Hi,

 

Welcome to FusionCharts Forum!

 

Due to technological differences, it is almost impossible to achieve 100% accuracy in visibility between flash and javascript chart.

 

For more details, please refer to the link: http://kb.fusionchar...nd+Flash+charts

 

Hope this helps.

[Guest Angie]

Hi,

 

Thanks for your appreciation.

 

We are glad to know that you have managed to get rid of your problem.

 

Keep smiling and keep FusionCharting!