| CFCHART | |||||||||||||||||||||||||||||||||||
| 説明
チャートを生成し、表示します。 |
|||||||||||||||||||||||||||||||||||
| カテゴリ
データ出力タグ、拡張タグ、『ColdFusion MX 開発ガイド』の第31章の「チャートとグラフの作成」 の「チャートの外観の設定」 | |||||||||||||||||||||||||||||||||||
シンタックスシンタックス 1
<!--- このシンタックスは XML ファイルまたは文字列を使用してチャートのスタイルを指定します。 --->
<cfchart
style = "XML string"、"filename">
</cfchart>
シンタックス 2
<!--- このシンタックスは cfchart タグの属性を使用してチャートのスタイルを指定します。 --->
<cfchart
foregroundColor = "Hex value"、"Web color"
chartHeight = "integer number of pixels"
chartWidth = "integer number of pixels"
dataBackgroundColor = "Hex value"、"Web color"
font = "font name"
fontBold = "yes"、"no"
fontItalic = "yes"、"no"
fontSize = "integer font size"
foregroundColor = "Hex value"、"Web color"
format = "flash"、"jpg"、"png"
gridlines = "integer number of lines"
labelFormat = "number"、"currency"、"percent"、"date"
markerSize = "integer number of pixels"
name = "String">
pieSliceStyle = "solid"、"sliced"
scaleFrom = "integer minimum value"
scaleTo = "integer maximum value"
seriesPlacement = "default"、"cluster"、"stacked"、"percent"
show3D = "yes"、"no"
showBorder = "yes"、"no"
showLegend = "yes"、"no"
showMarkers = "yes"、"no"
showXGridlines = "yes"、"no"
showYGridlines = "yes"、"no"
sortXAxis = "yes"、"no"
tipBGColor = "hex value"、"web color"
tipStyle = "MouseDown"、"MouseOver"、"none"
title = "title of chart"
url = "onClick destination page"
xAxisTitle = "title text"
xAxisType = "scale"、"category"
xOffset = "-1 ～ 1 の数値"
yAxisTitle = "title text"
yAxisType = "scale"、"category"
yOffset = "-1 ～ 1 の数値"
</cfchart>
|
|||||||||||||||||||||||||||||||||||
| 関連項目
cfchartdata、cfchartseries |
|||||||||||||||||||||||||||||||||||
| ヒストリ
ColdFusion MX 7:
ColdFusion MX 6.1:
ColdFusion MX: このタグが追加されました。
|
|||||||||||||||||||||||||||||||||||
| 使用方法
cfchart タグでは、グラフを表示する "コンテナ" を定義します。ここでは、高さ、幅、背景色ラベルなどを定義します。cfchartseries タグでは、棒グラフ、折れ線グラフ、円グラフなど、データを表示するチャートのスタイルを定義します。cfchartdata タグでは、データポイントを定義します。 データは、次の形で cfchartseries タグに渡されます。
font 属性の値 ArialUnicodeMS には、次のルールが適用されます。
次の表に、color 属性で使用できる W3C HTML 4 の色名値または 16 進値を示します。
その他の色値を指定する場合は、16 進数の値を入力します。RGB 値を指定する 6 桁の値、または RGB 値と透明度を指定する 8 桁の値を指定できます。8 桁の 16 進値の先頭の 2 桁は透明度を示します。FF は不透明を、00 は透明を表しています。00 ～ FF の範囲の値を使用できます。 一般的なブラウザでサポートされるその他の色名については、www.w3.org/TR/css3-color を参照してください。 また、チャートをメモリにキャッシュするかどうか、キャッシュするチャートの数、および ColdFusion で同時に処理できるチャートリクエストの数などを指定することができます。ColdFusion Administrator でこれらのオプションを設定するには、[サーバーの設定]-[チャート] を選択します。 |
|||||||||||||||||||||||||||||||||||
例<!---次の例では、cfdocexamples データベース内の給与データを分析し、 部門ごとの平均給与を示す棒グラフを作成します。cfchartseries タグの 本文には、クエリーからの利用不可能なデータを含めるために cfchartdata タグが 1 つ 含まれています。 ---> <!--- 未処理データをデータベースから取得します。 ---> <cfquery name="GetSalaries" datasource="cfdocexamples"> SELECT Departmt.Dept_Name, Employee.Dept_ID, Employee.Salary FROM Departmt, Employee WHERE Departmt.Dept_ID = Employee.Dept_ID </cfquery> <!--- クエリーオブクエリーを使用して、各部門の統計データを使用する ---> <!--- 新規クエリーを生成します。 ---> <!--- AVG および SUM で統計を計算します。 ---> <!--- GROUP BY で部門ごとの結果を生成します。 ---> <cfquery dbtype = "query" name = "DataTable"> SELECT Dept_Name, AVG(Salary) AS avgSal, SUM(Salary) AS sumSal FROM GetSalaries GROUP BY Dept_Name </cfquery> <!--- 生成された数値を千の位で四捨五入するように形式を設定し直します。 ---> <cfloop index = "i" from = "1" to = "#DataTable.RecordCount#"> <cfset DataTable.sumSal[i] = Round(DataTable.sumSal[i]/1000)*1000> <cfset DataTable.avgSal[i] = Round(DataTable.avgSal[i]/1000)*1000> </cfloop> <h1>従業員の給与の分析</h1> <!--- クエリーオブクエリーによる棒グラフ ---> <cfchart format="flash" xaxistitle="Department" yaxistitle="Salary Average"> <cfchartseries type="bar" query="DataTable" itemcolumn="Dept_Name" valuecolumn="avgSal"> <cfchartdata item="Facilities" value="35000"> </cfchartseries> </cfchart> |
|||||||||||||||||||||||||||||||||||