原創|其它|編輯:郝浩|2012-11-20 13:21:54.000|閱讀 2845 次
概述:本文為你介紹創建FusionCharts向下鉆取簡單鏈接的兩種方式,并提供XML和JSON示例代碼。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
所有的 FusionCharts 圖表(除了變焦線圖表)都支持向下鉆取功能,我們可以將單個數據塊(如柱狀圖中的列,餅圖中的扇形圖等)或者整個圖表轉換為熱點或鏈接。這些可以打開的URLs,是通過調用JavaScript函數或加載LinkedCharts來實現的。在FusionCharts上可以創建無限層級的向下鉆取,而且對所有需求都是通用的。
一般來說,FusionCharts的向下鉆取功能又可以分為兩類:
1、簡單鏈接:向下鉆取打開簡單的URLs或調用JavaScript函數(呈現在同一個頁面)
2、圖表鏈接(LinkedCharts):向下鉆取到詳細的LinkedCharts
本文首先將為你介紹簡單鏈接的創建方式。
用簡單鏈接,我們可以把每個數據項要鏈接的頁面(或JavaScript函數)添加一個URL地址。主要有以下幾種類型:
將link屬性放到<set>元素下,把數據圖轉換為一個鏈接,示例代碼如下:
<chart caption='Monthly Sales Summary' subcaption='For the year 2006' xAxisName='Month' yAxisName='Sales' numberPrefix='$'> <set label='Jan' value='17400' link='DemoLinkPages/DemoLink1.html'/> <!-- Simple Link --> <set label='Feb' value='19800' link='n-DemoLinkPages/DemoLink2.html'/> <!-- Link in new window --> <set label='Mar' value='21800' link='F-detailsFrame-DemoLinkPages/DemoLink3.htm'/> <!-- Link in a frame --> <set label='Apr' value='23800' link='P-detailsPopUp,width=400,height=300,toolbar=no, scrollbars=no,resizable=no-DemoLinkPages/DemoLink3.html'/> <!-- Link in a pop-up --> <set label='May' value='29600' link='j-myJavaScriptFunction-parameters'/> <!-- JavaScript function as link --> </chart>
同樣的,如果想用JSON數據代替XML,就必須將link屬性添加到數據項下,示例代碼如下:
{ "chart":{ "caption":"Monthly Sales Summary", "subcaption":"For the year 2006", "xaxisname":"Month", "yaxisname":"Sales", "numberprefix":"$" }, "data":[ { "label":"Jan", "value":"17400", "link":"DemoLinkPages/DemoLink1.html" }, { "label":"Feb", "value":"19800", "link":"n-DemoLinkPages/DemoLink2.html" }, { "label":"Mar", "value":"21800", "link":"F-detailsFrame-DemoLinkPages/DemoLink3.htm" }, { "label":"Apr", "value":"23800", "link":"P-detailsPopUp,width=400,height=300,toolbar=no," + "scrollbars=no,resizable=no-DemoLinkPages/DemoLink3.html" }, { "label":"May", "value":"29600", "link":"j-myJavaScriptFunction-parameters" } ] }
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自:慧都控件