JS圖表控件FusionCharts使用教程：定制圖表中的趨勢(shì)線和趨勢(shì)區(qū)

---

FusionCharts中的趨勢(shì)線是什么

在FusionCharts圖表中，趨勢(shì)線是橫跨圖標(biāo)的水平/垂直線條,用來表示一些預(yù)訂數(shù)據(jù)值。

在圖表中展示趨勢(shì)線

用戶可以使用<chart>元素中的trendlines屬性來顯示圖表中的趨勢(shì)線。

示例：<chart caption='Quarterly Sales Summary' subcaption='Figures in 

        xAxisName='Quarter' yAxisName='Sales' showValues='0'> 
     <set label='Qtr 1' value='420500' /> 
     <set label='Qtr 2' value='295400' /> 
     <set label='Qtr 3' value='523400' /> 
     <set label='Qtr 4' value='465400' />
     <trendLines> 
         <line startValue='430000' color='009933' displayvalue='Target' /> 
     </trendLines> 
 </chart>

趨勢(shì)線是按照用戶指定的值進(jìn)行繪制。如果指定的值不是在圖表的限制范圍中,那么趨勢(shì)線就完全不會(huì)顯示出來。

顯示圖表中趨勢(shì)線的文本

當(dāng)用戶使用toolText屬性的時(shí)候，趨勢(shì)線也可以顯示文本信息。用戶可以根據(jù)下列數(shù)據(jù)為趨勢(shì)線指定一個(gè)自定義工具文本:

<chart caption='Quarterly Sales Summary' subcaption='Figures in 
 xAxisName='Quarter' yAxisName='Sales' showValues='0'>
     <set label='Qtr 1' value='420500' />
     <set label='Qtr 2' value='295400' />
     <set label='Qtr 3' value='523400' />
     <set label='Qtr 4' value='465400' />
     <trendLines>
         <line startValue='430000' color='009933' displayvalue='Target'
               toolText='This trend was calculated last year'/>
     </trendLines>
 </chart>

什么是FusionCharts的趨勢(shì)區(qū)

趨勢(shì)區(qū)域類似于趨勢(shì)線,只是標(biāo)出的是一個(gè)區(qū)域整個(gè)區(qū)而不是一條線。用戶可以使用isTrendZone屬性指定圖表的趨勢(shì)區(qū)，如下所示：

<trendLines>
         <line startValue='350000' endValue='500000' isTrendZone='1' 
               color='009933' displayvalue='Target' />
 </trendLines>

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