JS圖表控件FusionCharts使用教程：在圖表中顯示標(biāo)識(shí)和圖片

---

在FusionCharts的圖表中顯示外部標(biāo)識(shí)

使用FusionCharts之后，用戶可以在運(yùn)行時(shí)加載需要在圖表中顯示的外部標(biāo)識(shí)/圖片/圖像。這個(gè)標(biāo)識(shí)可以GIF / JPEG / PNG或SWF文件格式駐留在和圖表SWF相同的子域。用戶需要使用圖表元素的logoURL屬性加載標(biāo)識(shí)，如下所示:

<chart yAxisName='Sales Figure' caption='Top 5 Sales Person' numberPrefix='$'
        useRoundEdges='1' bgColor='FFFFFF,FFFFFF' showBorder='0' exportEnabled='1'
        exportShowMenuItem='0' logoURL='fusionchartsv3.2-logo.png'>
   <set label='Alex' value='25000' /> 
   <set label='Mark' value='35000' /> 
   <set label='David' value='42300' /> 
   <set label='Graham' value='35300' /> 
   <set label='John' value='31300' />
 </chart>

請(qǐng)注意,由于安全原因Flash Player播放器不允許用戶加載有絕對(duì)路徑的跨域文件。因此,你的logoUrl文件應(yīng)該和圖表處在相同的域，并應(yīng)該從相對(duì)的路徑進(jìn)行加載。

設(shè)置圖表上標(biāo)識(shí)的位置

這個(gè)標(biāo)志可以使用< logoPosition = ' TL”……>屬性進(jìn)行配置，并在以下位置進(jìn)行顯示:

• TR - Top-right of the chart
• BL - Bottom-left of the chart
• BR - Bottom-right of the chart
• CC - Center of the chart Configuring logo opacity and scale

改變標(biāo)識(shí)的縮放比例和透明度

標(biāo)識(shí)完成加載之后,它的不透明度和規(guī)?？梢远伎梢酝ㄟ^(guò)使用<chart>元素中的logoAlpha和logoScale屬性進(jìn)行設(shè)置，如下所示:

<chart yAxisName='Sales Figure' caption='Top 5 Sales Person' numberPrefix='$'
        useRoundEdges='1' bgColor='FFFFFF,FFFFFF' showBorder='0' exportEnabled='1'
        exportShowMenuItem='0' logoURL='fusionchartsv3.2-logo.png' logoPosition='CC' 
        logoAlpha='30' logoScale='110'> 
   <set label='Alex' value='25000' /> 
   <set label='Mark' value='35000' /> 
   <set label='David' value='42300' /> 
   <set label='Graham' value='35300' /> 
   <set label='John' value='31300' />
 </chart>

為標(biāo)識(shí)添加超鏈接

用戶可以通過(guò)設(shè)置為標(biāo)識(shí)添加超鏈接，具體操作如下：

<chart ... logoLink='link in FusionCharts format'>

這個(gè)鏈接可以在當(dāng)前窗口、新窗口、彈出窗口、框架甚至調(diào)用JavaScript方法進(jìn)行打開(kāi)。

》》》免費(fèi)下載FusionCharts最新版