Atom Report post Posted October 13, 2019 I have been able to accomplish most of what I wanted as you can see here: http://www.siftradingsystems.com/MyStuffJS.html Now I'm just looking to fine tune the appearance such as setting the line thickness and color for a line chart and setting font size and type. Share this post Link to post Share on other sites
Akash Biswas Report post Posted October 14, 2019 Hi, You can customize the chart visuals by using the configuration attributes supported for setting the chart cosmetics. For example, you can set the attribute "lineThickness" to define the thickness of the line in a line chart. To set the base font for any text element on the chart set "baseFontSize" or "baseFont". Also specific font attributes are also supported for individual elements like "labelFontSize" to set font size for x-axis labels, or "valueFontSize" for data plot values. Please refer to the attributes list for each chart types available : https://www.fusioncharts.com/dev/chart-attributes/line Also check the documentation for further reference : https://www.fusioncharts.com/dev/chart-guide/chart-configurations/data-plot For font configuration : https://www.fusioncharts.com/dev/chart-guide/chart-configurations/fonts Thanks, Akash. Share this post Link to post Share on other sites
Atom Report post Posted October 14, 2019 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" id="viewport" content="target-densitydpi=high-dpi,initial-scale=1.0,user-scalable=no" /> <title>'<?php echo $_GET["sysname"] ?>'</title> <link href="styles.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <script type="text/javascript" src="FusionCharts/js/fusioncharts.js"></script> <script type="text/javascript" src="FusionCharts/js/fusioncharts.charts.js"></script> <style type="text/css"></style> <?php $DataFile = "clientFTP/".$_GET["sysname"].$_GET["period"].$_GET["DFS"].".xml"; $CType = $_GET["ChtType"]; ?> <script type="text/javascript"> FusionCharts.ready(function(){ var fusioncharts = new FusionCharts({ type: '<?php echo $CType ?>', renderAt: 'chartContainer', width: '500', height: '300', lineThickness: '1', lineColor: 'FFFFFF', dataFormat: 'xmlurl', dataSource: '<?php echo $DataFile ?>', }); fusioncharts.render(); }); </script> </head> <body class="twoColFixLtHdr"> <div id="container"> <div id="header" class="fltlft"><img src="images/logo.jpg" alt="SIF Trading Systems Logo" class="fltlft" /> <img src="images/software_box.jpg" alt="Software Box" class="fltrt" /> </div> <br class="clearfloat" /> <div id="chartContainer" style="margin-left: 200px"></div> <div style="margin-left: 200px"><br> <p>This chart is automatically updated directly from a TradeStation chart.</p><!--<p>This chart does not include the current month.</p>--> <p style="margin-right: 125px">PAST PERFORMANCE WHETHER REAL OR HYPOTHETICAL IS NO GUARANTEE OF FUTURE RESULTS.</p></div> <div id="footer"> <p><a href="<?php echo $_GET["sysname"] ?>JS.html"><?php echo $_GET["sysname"] ?></a></p> </div> </div> </body> </html> Changing the lineThickness value in the above code does nothing. I am able to change the width, for instance. Share this post Link to post Share on other sites
Akash Biswas Report post Posted October 14, 2019 Hi, The attributes "lineThickness" or "lineColor" are not FusionCharts constructor parameters like "width" or "height". These are configuration attributes of the chart dataSource, so you need to define them within the "chart" object of the dataSource. Please refer to the sample fiddle for reference : http://jsfiddle.net/2v5t1mrd/3/ Thanks, Akash. Share this post Link to post Share on other sites
Atom Report post Posted October 14, 2019 <chart caption='MyStuff (Updated: Oct 14 07:03 AM)' subcaption='From: Oct, 2017 To: 10/14/19 Net $ by Month - Trend ' xAxisName='Months' yAxisName='Net $' bgColor='9AB5E4' alternateHGridColor='E3EBF5' showValues='0' labelStep='2' lineColor='FF0000'> <set label='0' value='0.00' /> <set label='1' value='2057.50' /> <set label='2' value='1975.00' /> <set label='3' value='12925.00' /> <set label='4' value='16460.00' /> <set label='5' value='18982.50' /> <set label='6' value='28310.00' /> <set label='7' value='32490.00' /> <set label='8' value='31487.50' /> <set label='9' value='39670.00' /> <set label='10' value='42145.00' /> <set label='11' value='43117.50' /> <set label='12' value='36377.50' /> <set label='13' value='45702.50' /> <set label='14' value='46740.00' /> <set label='15' value='57550.00' /> <set label='16' value='60987.50' /> <set label='17' value='69365.00' /> <set label='18' value='70443.61' /> <set label='19' value='68802.71' /> <set label='20' value='69307.71' /> <set label='21' value='74572.71' /> <set label='22' value='79697.71' /> <set label='23' value='76312.71' /> <set label='24' value='77730.21' /> </chart> My chart data is coming from a file (xml) that looks as above. Do I need to change the structure of this file? I am migrating from flash version. Share this post Link to post Share on other sites
Akash Biswas Report post Posted October 15, 2019 Hi, Yes, the attributes "lineColor" and "lineThickness" must be a part of the XML dataSource within the <chart> tag. Check the below sample fiddle for the XML structure with the mentioned attributes defined. Sample fiddle : https://jsfiddle.net/dbjsmrc7/4/ Thanks, Akash. Share this post Link to post Share on other sites
Atom Report post Posted October 15, 2019 Ok, I think I have it now. Thank you. Share this post Link to post Share on other sites
Akash Biswas Report post Posted October 16, 2019 Welcome Share this post Link to post Share on other sites
