原創(chuàng)|其它|編輯:郝浩|2012-11-22 15:27:46.000|閱讀 3221 次
概述:本文告訴你如何將FusionCharts單序列的柱狀圖轉(zhuǎn)換為單序列的餅狀圖,無需更改初始數(shù)據(jù)。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關(guān)鏈接:
你有沒有想過,將 FusionCharts 創(chuàng)建好的柱狀圖轉(zhuǎn)換為一張餅狀圖,并且不需要改變初始數(shù)據(jù)。這個轉(zhuǎn)換后的餅狀圖仍然支持動畫和交互性(如餅圖的分片、用鼠標(biāo)旋轉(zhuǎn)、標(biāo)簽工具條等)。
很簡單,要改變圖表類型,只需編輯先前的代碼,更改SWF文件名稱為Pie3D.swf。
在本例中,復(fù)制 weekly-sales.html 并將它在同一個文件夾中保存為weekly-sales-pie.html。最后,編輯HTML代碼:
<html> <head> <title>My First chart using FusionCharts XT - change chart type</title> <script type="text/javascript" src="FusionCharts/FusionCharts.js"></script> </head> <body> <div id="chartContainer">FusionCharts XT will load here!</div> <script type="text/javascript"><!-- var myChart = new FusionCharts( "FusionCharts/Pie3D.swf", "myChartId", "400", "300", "0", "1" ); myChart.setXMLUrl("Data.xml"); myChart.render("chartContainer"); // --> </script> </body> </html>
解釋一下上面這段代碼,我們已經(jīng)改變了SWF文件路徑,之前是指向Column3D.swf的,現(xiàn)在指向Pie3D.swf。你需要從Charts 文件夾中復(fù)制Pie3D.swf。如果你現(xiàn)在在瀏覽器中打開HTML文件,會看到類似于下面這種餅圖(點擊圖片查看在線Demo):
單擊餅圖分片,分片扇形就會分離出來。或者在圖表上右鍵單擊選中"Enable Rotation",就可以用鼠標(biāo)拖拽圖表進(jìn)行旋轉(zhuǎn)。
注意,我們之所以能夠在不改變數(shù)據(jù)的情況下轉(zhuǎn)換圖表類型,是因為新的圖表類型與初始數(shù)據(jù)是兼容的。比如,在本例中,我們是將一個單序列的柱狀圖轉(zhuǎn)換為單序列的餅圖。也就是說,只有在兩個圖表都是單序列的時候,圖表類型的初始數(shù)據(jù)才是有效的。如果你想在單序列圖表上使用多序列數(shù)據(jù),那么圖表上就不會有任何數(shù)據(jù)顯示。
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉(zhuǎn)載自:慧都控件