hienduong Report post Posted December 6, 2011 Dear, For the grid, I need to make the white bar transparent. The gray changes to darker gray (or whatever). Is that possible? I illustrate in the attachment. Please support me fast, it's very urgent! Share this post Link to post Share on other sites
Guest Bindhu Report post Posted December 6, 2011 (edited) Hi, Thank you for the post. FusionCharts lets you configure anything you see on the chart With respect to your requirement, please find the responses below, 1. To set the canvas border color, you should use the "canvasbordercolor" attribute of the chart, and set it to the desired color. 2. To make the canvas transparent, you should use the "canvasbgAlpha" attribute of the chart and set it to 0. 3. To apply alternate color for the horizontal grids, you should use the "alternateHGridColor" attribute of the chart and set it to the desired color, in your case, yellow. 4. To apply color(in your case white color) to the labels present outside the canvas, you should use the "outCnvBaseFontColor" attribute of the chart and set it desired color. Please find a sample XML below, <chart caption='This chart is for demo' subcaption='Business Results 2010' xAxisName='Month' yAxisName='Revenue' yAxisMinValue='300000' bgcolor="#000000" showAlternateHGridColor="1" canvasbordercolor="#FFFFFF" alternateHGridColor='#FFCC11' canvasbgAlpha='0' outCnvBaseFontColor='#FFFFFF'> <set label='Jan' value='420000' color='#00611C'/> <set label='Feb' value='910000' color='#00611C'/> <set label='Mar' value='720000' color='#00611C'/> <set label='Apr' value='550000' color='#00611C'/> <set label='May' value='810000' color='#00611C'/> <set label='Jun' value='510000' color='#00611C'/> <set label='Jul' value='680000' color='#00611C'/> <set label='Aug' value='620000' color='#00611C'/> <set label='Sep' value='610000' color='#00611C'/> <set label='Oct' value='490000' color='#00611C'/> <set label='Nov' value='530000' color='#00611C'/> <set label='Dec' value='330000' color='#00611C'/> </chart> Also, please find attached the screen shot of a sample chart for the above XML data. Hope this helps!! Happy FusionCharting Edited December 6, 2011 by Bindhu Share this post Link to post Share on other sites
hienduong Report post Posted December 7, 2011 Hi, Thank you for the post. FusionCharts lets you configure anything you see on the chart With respect to your requirement, please find the responses below, 1. To set the canvas border color, you should use the "canvasbordercolor" attribute of the chart, and set it to the desired color. 2. To make the canvas transparent, you should use the "canvasbgAlpha" attribute of the chart and set it to 0. 3. To apply alternate color for the horizontal grids, you should use the "alternateHGridColor" attribute of the chart and set it to the desired color, in your case, yellow. 4. To apply color(in your case white color) to the labels present outside the canvas, you should use the "outCnvBaseFontColor" attribute of the chart and set it desired color. Please find a sample XML below, <chart caption='This chart is for demo' subcaption='Business Results 2010' xAxisName='Month' yAxisName='Revenue' yAxisMinValue='300000' bgcolor="#000000" showAlternateHGridColor="1" canvasbordercolor="#FFFFFF" alternateHGridColor='#FFCC11' canvasbgAlpha='0' outCnvBaseFontColor='#FFFFFF'> <set label='Jan' value='420000' color='#00611C'/> <set label='Feb' value='910000' color='#00611C'/> <set label='Mar' value='720000' color='#00611C'/> <set label='Apr' value='550000' color='#00611C'/> <set label='May' value='810000' color='#00611C'/> <set label='Jun' value='510000' color='#00611C'/> <set label='Jul' value='680000' color='#00611C'/> <set label='Aug' value='620000' color='#00611C'/> <set label='Sep' value='610000' color='#00611C'/> <set label='Oct' value='490000' color='#00611C'/> <set label='Nov' value='530000' color='#00611C'/> <set label='Dec' value='330000' color='#00611C'/> </chart> Also, please find attached the screen shot of a sample chart for the above XML data. Hope this helps!! Happy FusionCharting Great help! Thanks. I have some more questions as I illustrate in the image below: Here is my code: <html> <head> <title>My First chart using JavaScript/Flash</title> <script type="text/javascript" src="Charts/FusionCharts.js"> </script> </head> <body bgcolor="#333333"> <div id="container1" style="width:500;height:250;"> <script type="text/javascript"> var myChart1 = new FusionCharts( "charts/Line.swf","chartNo1", "100%", "100%", "0", "1" ); myChart1.setXMLData("<chart xAxisName='' yAxisName='' showValues='0' legendIconScale='2' showBorder = '0' canvasBorderThickness = '1' alternateHGridAlpha = '0' canvasbgAlpha = '0' outCnvBaseFontColor='#FFFFFF' lineColor='006600' bgColor = 'FFFFFF,FFFFFF' bgAlpha='0,0' ><set label='3/2010' value='7.0000' /><set label='6/2010' value='95.0000' /><set label='9/2010' value='73.0000' /><set label='12/2010' value='1.0000' /><set label='3/2011' value='21.0000' /><set label='6/2011' value='6.0000' /><set label='9/2011' value='18.0000' /><set label='12/2011' value='9.0000' /><styles><definition><style type='Shadow' name='Shadow_1' Angle='130' Color='#FFFFFF' Alpha='100' blurX='0' blurY='0' Strength='1'/></definition><application><apply toObject='CANVAS' styles='Shadow_1'/></application></styles></chart>"); myChart1.setTransparent(true); myChart1.render("container1"); </script> </div> </body> </html> Share this post Link to post Share on other sites
Guest Bindhu Report post Posted December 7, 2011 (edited) Hi, Thank you for the post and glad to know that the solution helped you solve the issue With regards to your requirement, please find the responses below as applicable, Remove divLines. >> To remove the divisional lines, use "numDivLines" attribute of the chart and set it to 0. Remove top and right canvas border. >>I'm afraid, FusionCharts does not have any attribute to remove the top and right border of the canvas. As a work around, set the "chartTopMargin", "chartRightMargin" and "showLimits" to 0, without setting the "caption". If you need the Chart caption to be visible, then chartTopMargin attribute set to 0, does not serve the purpose. Since it is a line chart, add an empty set element tag as a last value. Please find the attached XML and screenshot for your reference. Can I fill the alternate grid with a png file >> We are afraid, FusionCharts does not support png file as input for the alternate horizontal grids. However, you can specify an external image (GIF,JPEG or PNG only) or an SWF file as the background of the chart. For more information on "Chart Border and Background", please refer to the below link, http://docs.fusionch...Background.html I hope this helps!! Happy FusionCharting Sample.xml Edited December 7, 2011 by Bindhu Share this post Link to post Share on other sites
hienduong Report post Posted December 9, 2011 Remove top and right canvas border. >>I'm afraid, FusionCharts does not have any attribute to remove the top and right border of the canvas. Thanks for your response. So please tell me why in this code fusionchart can get rid of the canvas' right and top border? <chart showSum='0' numdivlines='0' numberSuffix='' numberPrefix='' useRoundEdges='0' bgColor='FFFFFF,FFFFFF' legendPosition='RIGHT' showYAxisValues ='0' showBorder='0' showPlotBorder='0' plotFillRatio='100' plotSpacePercent='70' canvasBorderAlpha='0'> <categories> <category label='Jan' /> <category label='Feb' /> <category label='Mar' /> <category label='Apr' /> <category label='May' /> <category label='Jun' /> <category label='Jul' /> <category label='Aug' /> <category label='Sep' /> <category label='Oct' /> <category label='Nov' /> <category label='Dec' /> </categories> <dataset seriesName='2006'> <set value='27400' /> <set value='29800'/> <set value='25800' /> <set value='26800' /> <set value='29600' /> <set value='32600' /> <set value='31800' /> <set value='36700' /> <set value='29700' /> <set value='31900' /> <set value='34800' /> <set value='24800' /> </dataset> <dataset seriesName='2005'> <set value='10000'/> <set value='11500'/> <set value='12500'/> <set value='15000'/> <set value='11000' /> <set value='9800' /> <set value='11800' /> <set value='19700' /> <set value='21700' /> <set value='21900' /> <set value='22900' /> <set value='20800' /> </dataset> <styles> <definition> <style type="Shadow" name="Shadow_1" Angle="130" Color="000000" Alpha="100" blurX="0" blurY="0" Strength="2"/> </definition> <application> <apply toObject="CANVAS" styles="Shadow_1"/> </application> </styles> </chart> This is the code of another supporter, not mine (I use the purchased version) Share this post Link to post Share on other sites
Guest Angshu Report post Posted December 12, 2011 Hi, Thanks for your response. FusionCharts does not support natively to remove the canvas right and top border, as of now. This is a work around using STYLES to remove the same. For more information on STYLES, please visit the links below: http://docs.fusioncharts.com/charts/?Styles/Styles.html http://docs.fusioncharts.com/charts/?Styles/HowToUse.html http://docs.fusioncharts.com/charts/?Styles/Shadow.html Hope this helps. Share this post Link to post Share on other sites
R One Report post Posted July 10, 2015 Hi, Please assist me how remove line from fusion chart - Also arrow marked in the attachment. it's very urgent! Share this post Link to post Share on other sites
Vishalika Report post Posted July 20, 2015 Hi, Can you please elaborate the issue more? Also, please mention the version of FusionCharts. Awaiting response. Share this post Link to post Share on other sites
