fusionchart的debug模式
<script type="text/javascript">
var myChart = new FusionCharts("../FusionCharts/Column2D.swf", "myChartId", "600", "300", "1", "0");
myChart.setDataURL("Data.xml");
myChart.render("chartdiv");
</script>
对应构造方法参数含义
1.URL of SWF file of the chart type that we intend to use
2.Id for the chart - You can give any id for the chart. Just make sure that if you're using multiple charts in the same HTML page, each chart should have a unique Id.
3.Required width and height of the chart.
4.The last two parameters are debugMode and registerWithJS and are normally set to 0. We'll explain those parameters later.
效果图如下
在使用fusioncharts的时候,有时候你可能要修改其默认的提示信息。如在默认情况下没有数据时显示:no data to display,你要实现自定义你可以通过以下方式实现。
fusioncharts3.1中文提示解决
var myChart = new FusionCharts("../FusionCharts/Column2D.swf?ChartNoDataText=无数据显示", "myChartId", "600", "300");
fusioncharts3.2中文提示解决
<script type="text/javascript"><!--
var myChart = new FusionCharts("Column2D.swf", "myChartId", "300", "250", "0", "1");
myChart.setXMLUrl("<chart></chart>");
myChart.configure( "ChartNoDataText", "Please select a record above");
myChart.configure( "InvalidXMLText", "Please validate data");
myChart.render("chartContainer");
// --></script>
3.2的解决方式较好,在3.1的fusioncharts.js中是没有configure这个方法的。此方法出在3.2中倒是有。不足的是现在网上3.2的破解版还不十分完美,swf文件差异较大.
详见官方文档:http://www.fusioncharts.com/docs/ChartMessages.html
fusioncharts事件处理
官网上支持的事件
Event Name |
When is it raised? |
What to use it for? |
FC_Loaded(DOMId) |
When the chart SWF has finished downloading in the user's browser. |
To hide any loader components that you might have on your page. |
FC_Rendered(DOMId) |
When the chart has finished rendering. This call is made only once per loaded chart SWF (even if new data is supplied to it via setDataURL or setDataXML method). |
To invoke any further JavaScript methods on chart, or to change the data of chart. |
FC_DataLoaded(DOMId) |
When the data of the chart has finished loading - both in dataXML or dataURL method. |
To further process data in any other components in your page. |
FC_DataLoadError(DOMId) |
When there was an error in loading data from the specified URL |
To show an error message to user, or to take a corrective measure |
FC_NoDataToDisplay(DOMId) |
When the XML data loaded by chart didn't contain any data to display |
To show an error message to user, or to take a corrective measure |
FC_DataXMLInvalid(DOMId) |
When the XML data loaded by chart was invalid (wrong XML structure) |
To show an error message to user, or to take a corrective measure |
|
使用 <HTML> <HEAD> <TITLE>FusionCharts & JavaScript - Basic Example</TITLE> <SCRIPT LANGUAGE="Javascript" SRC="FusionCharts.js"></SCRIPT> <SCRIPT LANGUAGE="JavaScript"> function FC_Rendered(DOMId){ if (DOMId=="chart1Id"){ alert("Look Ma! I am Column3D and I've finished loading and rendering."); return false; } } function getChartXML(){ var chartToPrint = getChartFromId("chart1Id"); alert(chartToPrint.getXML()); } </SCRIPT> </HEAD> <BODY> <div id="chart1div"> FusionCharts </div> <script language="JavaScript"> var chart1 = new FusionCharts("Column3D.swf", "chart1Id", "400", "300", "0", "1"); chart1.setDataXML("<chart><set label='A' value='10' /><set label='B' value='11' /></chart>"); chart1.render("chart1div"); </script> <center><input type='button' value='Show Chart XML' onClick='javascript:getChartXML();'></center> </BODY> </HTML> |
注意最后两个参数一定是0,1,不然事件方法是不会调用的.
fusioncharts如何处理y轴整数显示问题
有 时候我们图的y轴要求显示次数或数量之类的什么。这些都整数,如果放任fusioncharts自动生成DivLines,那就麻烦了,如果你的 yAxisMaxValue%numDivLines!=0的话,你的y轴间隔线上显示的就是小数,不管你怎么调其它的参数都无济于事。所以要真正实现整 数显示
你就要自己处理yAxisMaxValue,numDivLines,yAxisMinValue这些值。保证yAxisMaxValue%numDivLines==0.最近记得设置adjustDiv=0
还有一个特殊情况就是当显示数据value值为0时,y轴也会也小数的问题。这时最好手动设置yAxisMaxValue=5之类的整数
自动设置fusioncharts的yAxisMaxValue,yAxisMinValue.
对于single series我们遍历set的value值取最大值与最小值
对于multi series 我们要取所有DataSet中最大值与最小值
有时为了显示的好看,我们最好将最大最小边界在原来的基础上增加15%的比例,以保证图型居中