Sign in to follow this  
renukasagani

Javascript Render Chart Issue

Recommended Posts

Hi,

 

I am using FusionCharts_v_3.2.1 with java script render concept. I am able to render using below xml, but the chart properties are not working as flash properties.

 

Below are the issues phased with java script render:

1. legend marker should come as square, please find attached the image of the java script chart which is being rendered as vertical rectangle legend marker.

 

2.Data labels are not adjusting automatically , if category label length is high ,appearing only half of the name .

 

3.Number of div lines of chart also not working, I have adjusted to 5 but still it is coming as 10.

 

My code is :

 

<div id="chartContainer">FusionCharts will load here!</div>

 

<script type="text/javascript">

var myChartx = new FusionCharts( "http://localhost/test/FusionCharts_3.2.1/Charts/StackedColumn2D.swf","myNext", "600", "400", "0", "1" );

 

 

myChartx.setXMLData("<chart decimalPrecision='0' showValues='1' showNames='1' numberSuffix=' %' pieSliceDepth='20' formatNumberScale='0' exportEnabled='1' exportAtClient='0' exportAction='save' exportHandler='http://localhost/test/FusionCharts_3.2.1/ExportHandlers/PHP/FCExporter.php' exportFileName='133-4145-1289454166' overRideLimitCalc='1' showPlotBorder='1' plotBorderColor='000000' plotBorderThickness='2' plotGradientColor='' plotBorderAlpha='75' animation='0' placeValuesInside='1' exportShowMenuItem='0' yAxisMinValue='0' yAxisMaxValue='100' numDivLines='5'><categories> <category label='Private Buses' /> <category label='Govt Buses' /></categories><dataset seriesName='India' color='008800' > <set value='10' color='008800' showValue='10' /> <set value='20' color='008800' showValue='20' /> </dataset><dataset seriesName='US' color='CDFFCC' > <set value='30' color='CDFFCC' showValue='30' /> <set value='40' color='CDFFCC' showValue='40' /> </dataset> <styles><definition><style name='MyFirstFontStyle' type='font' face='Verdana' size='10' color='333333' bold='1' /> <style name='MyFirstAnimationStyle' type='animation' param='_yScale' start='0' duration='1' /> <style name='MyFirstShadow' type='Shadow' color='CCCCCC' /> </definition><application> <apply toObject='DataValues' styles='MyFirstFontStyle,MyFirstAnimationStyle' /> </application> </styles> </chart>");

 

myChartx.render("chartContainer");

 

myChartx._overrideJSChartConfiguration({

exporting:{

url: 'http://localhost/test/export/exporting-server/index.php',

type: 'image/svg+xml'

},

chart: {

marginTop: 30,

marginRight: 30

},

xAxis: {

labels: {

align: "right",

rotation: 0

}

},

yAxis: [{

yaxisminvalue: "0",

yaxismaxvalue: "100",

numDivLines: "5"

 

}]

 

 

 

 

});

</script>

 

 

Please review the code , and let me know the solution as soon as possible, Please consider my request with high priority.

 

Thanks,

Renuka

post-7013-002657000 1289542299_thumb.jpg

Share this post


Link to post
Share on other sites

Hi,

 

I am using FusionCharts_v_3.2.1 with java script render concept. I am able to render using below xml, but the chart properties are not working as flash properties.

 

Below are the issues phased with java script render:

1. legend marker should come as square, please find attached the image of the java script chart which is being rendered as vertical rectangle legend marker.

 

2.Data labels are not adjusting automatically , if category label length is high ,appearing only half of the name .

 

3.Number of div lines of chart also not working, I have adjusted to 5 but still it is coming as 10.

 

My code is :

 

<div id="chartContainer">FusionCharts will load here!</div>

 

<script type="text/javascript">

var myChartx = new FusionCharts( "http://localhost/test/FusionCharts_3.2.1/Charts/StackedColumn2D.swf","myNext", "600", "400", "0", "1" );

 

 

myChartx.setXMLData("<chart decimalPrecision='0' showValues='1' showNames='1' numberSuffix=' %' pieSliceDepth='20' formatNumberScale='0' exportEnabled='1' exportAtClient='0' exportAction='save' exportHandler='http://localhost/test/FusionCharts_3.2.1/ExportHandlers/PHP/FCExporter.php' exportFileName='133-4145-1289454166' overRideLimitCalc='1' showPlotBorder='1' plotBorderColor='000000' plotBorderThickness='2' plotGradientColor='' plotBorderAlpha='75' animation='0' placeValuesInside='1' exportShowMenuItem='0' yAxisMinValue='0' yAxisMaxValue='100' numDivLines='5'><categories> <category label='Private Buses' /> <category label='Govt Buses' /></categories><dataset seriesName='India' color='008800' > <set value='10' color='008800' showValue='10' /> <set value='20' color='008800' showValue='20' /> </dataset><dataset seriesName='US' color='CDFFCC' > <set value='30' color='CDFFCC' showValue='30' /> <set value='40' color='CDFFCC' showValue='40' /> </dataset> <styles><definition><style name='MyFirstFontStyle' type='font' face='Verdana' size='10' color='333333' bold='1' /> <style name='MyFirstAnimationStyle' type='animation' param='_yScale' start='0' duration='1' /> <style name='MyFirstShadow' type='Shadow' color='CCCCCC' /> </definition><application> <apply toObject='DataValues' styles='MyFirstFontStyle,MyFirstAnimationStyle' /> </application> </styles> </chart>");

 

myChartx.render("chartContainer");

 

myChartx._overrideJSChartConfiguration({

exporting:{

url: 'http://localhost/test/export/exporting-server/index.php',

type: 'image/svg+xml'

},

chart: {

marginTop: 30,

marginRight: 30

},

xAxis: {

labels: {

align: "right",

rotation: 0

}

},

yAxis: [{

yaxisminvalue: "0",

yaxismaxvalue: "100",

numDivLines: "5"

 

}]

 

 

 

 

});

</script>

 

 

Please review the code , and let me know the solution as soon as possible, Please consider my request with high priority.

 

Thanks,

Renuka

 

waiting for your feedback

 

Thanks,

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this