[AJava]FusionCharts Free中国語開発ガイド[ドキュメントを使用するチュートリアル]第7章--FusionCharts FreeとXML


FusionChartsはXMLを使用してグラフィックを作成および制御します.
データ型
FCFには、全部で4種類のデータ型があります.
Boolean-値は0または1、1はtrue、0はfalseです.たとえばです.
Number-その値は数値であるべきです.例えばである.
String-その値は文字列です.たとえばです.
Hex Color Code-16進数の色を表し、「#」は必要ありません.例えばである.
各グラフィックには多くのプロパティがあり、XMLで設定できますが、デフォルト値があるため、設定していない場合はFCFがデフォルト値で置き換えられるため、各プロパティを設定する必要はありません.
FCFにはいくつかのXML構造があります.
シングルシリーズグラフィックス
単一シリーズのグラフィックとは、データセットが1つしかないグラフィックです.たとえば、私たちの最初の例は、毎月の販売状況で、単一のシリーズのグラフィックです(私たちは1年のデータしかありません).私たちはデータを比較していません.例えば、2年間の毎月の販売状況を比較しています.
次の例を見てみましょう.
画像1

<graph caption='Business Results 2006' xAxisName='Month' yAxisName='Revenue' showValues='0'   
numberPrefix='$' decimalPrecision='0' bgcolor='F3f3f3' bgAlpha='70' showColumnShadow='1'     
divlinecolor='c5c5c5' divLineAlpha='60' showAlternateHGridColor='1' alternateHGridColor='f8f8f8'   
  alternateHGridAlpha='60' >                
   <set name='Jan' value='27400' color='AFD8F8'/>           
   <set name='Feb' value='29800' color='F6BD0F' />           
   <set name='Mar' value='25800' color='8BBA00'/>           
   <set name='Apr' value='26800' color='FF8E46'/>           
   <set name='May' value='29600' color='008E8E' />           
   <set name='Jun' value='32600' color='D64646'/>           
   <set name='Jul' value='31800' color='8E468E'/>           
   <set name='Aug' value='36700' color='588526'/>           
   <set name='Sep' value='29700' color='B3AA00'/>           
   <set name='Oct' value='31900' color='008ED6'/>           
   <set name='Nov' value='34800' color='9D080D'/>           
   <set name='Dec' value='24800' color='A186BE' />           
           
 <trendlines>           
   <line startValue='26000' color='91C728' displayValue='Target' showOnTop='1'/>           
 </trendlines>           
           
</graph>   

上のコードには私たちが接触したことのない属性がいくつかあります.大丈夫です.グラフィックXMLの参考章では、すべてのグラフィックで使用できる属性を詳しく説明します.
簡単な説明をします
要素は、すべてのFCF XMLドキュメントの主な要素です.データの開始と終了を説明します.グラフィックを制御できるアトリビュートもあります.これらのプロパティは、グラフィックXMLの参照章で説明します.
要素はのサブ要素であり、グラフィック上のデータを決定するデータセットを記述する.典型的な要素は、次のように見えます.
<set name='Jan' value='27400' color='AFD8F8' hoverText="January, 17400" link="details.asp?month=jan" showName="1"/>   

要素.グラフィックにトレンド線を描くことができます.たとえば、次のコードでは、月平均の売上高を表すために26000という値に線を引いています.
<line startValue='26000' color='91C728' displayValue='Target' showOnTop='1'/>   

マルチシリーズグラフィックス
複数のシリーズのグラフィックを使用して、2つ以上のデータセットを比較します.
次のコードを見てみましょう.
画像1

<graph caption='Business Results 2005 v 2006' xAxisName='Month' yAxisName='Revenue'   
  showValues='0' numberPrefix='$' decimalPrecision='0' bgcolor='F3f3f3' bgAlpha='70'     
  showColumnShadow='1' divlinecolor='c5c5c5' divLineAlpha='60' showAlternateHGridColor='1'     
  alternateHGridColor='f8f8f8' alternateHGridAlpha='60' >   
   
  <categories>   
    <category name='Jan' />   
    <category name='Feb' />   
    <category name='Mar' />   
    <category name='Apr' />   
    <category name='May' />   
    <category name='Jun' />   
    <category name='Jul' />   
    <category name='Aug' />   
    <category name='Sep' />   
    <category name='Oct' />   
    <category name='Nov' />   
    <category name='Dec' />   
  </categories>   
   
  <dataset seriesName='2006' color='c4e3f7' >   
    <set value='27400' />   
    <set value='29800' />   
    <set value='25800' />   
    <set value='26800' />   
    <set value='29600' />   
    <set value='32600' />   
    <set value='31800' />   
    <set value='36700' />   
    <set value='29700' />   
    <set value='31900' />   
    <set value='34800' />   
    <set value='24800' />   
  </dataset>   
   
  <dataset seriesName='2005' color='Fad35e' >   
    <set value='10000'/>   
    <set value='11500'/>   
    <set value='12500'/>   
    <set value='15000'/>   
    <set value='11000' />   
    <set value='9800' />   
    <set value='11800' />   
    <set value='19700' />   
    <set value='21700' />   
    <set value='21900' />   
    <set value='22900' />   
    <set value='20800' />   
  </dataset>   
   
  <trendlines>   
    <line startValue='26000' color='91C728' displayValue='Target' showOnTop='1'/>   
  </trendlines>   
   
</graph>   
  
上には要素が1つ多く、例えば多くのサブ要素が含まれていることが分かった.
<category name='Jan' />   

はX軸上の名前を表します.
上には2つの要素があり、1つは2006年のデータを表し、1つは2005年を表す.各はグラフィック上のデータを表す.
のサブエレメントの数はのサブエレメントと一致する必要があります.
次の章では、コンビネーション図のXMLを見てみましょう.