Visualforce 開発者ガイド
japex:areaSeries
Visualforce グラフで網掛け領域として表示されるデータ系列です。fill 属性を true に設定した折れ線グラフの系列に似ていますが、各 X 値に対する複数の Y 値がレベルとしてそれぞれの上に「積み上げ」られます。
少なくとも、各点が表す領域量を定義する線に沿って各点の X 値および Y 値として使用するデータコレクションの項目、および目盛りとして使用する X 軸および Y 軸を指定する必要があります。グラフにレベルを追加するには、複数の Y 値を追加します。各レベルには新しい色が使用されます。
注: このコンポーネントは <apex:chart> コンポーネントで囲む必要があります。1 つのグラフに複数の <apex:areaSeries> コンポーネントを使用でき、<apex:barSeries>、<apex:lineSeries>、および <apex:scatterSeries> コンポーネントを追加できますが、判読しにくい結果になる可能性があります。
3 つの Y 値をレベルとしてプロットする面グラフ。
1<apex:chart height="400" width="700" animate="true" legend="true" data="{!data}">
2 <apex:legend position="left"/>
3 <apex:axis type="Numeric" position="left" fields="data1,data2,data3"
4 title="Closed Won" grid="true">
5 <apex:chartLabel/>
6 </apex:axis>
7 <apex:axis type="Category" position="bottom" fields="name"
8 title="Month of the Year">
9 <apex:chartLabel rotate="315"/>
10 </apex:axis>
11 <apex:areaSeries axis="left" xField="name" yField="data1,data2,data3" tips="true"/>
12</apex:chart>属性
| 属性名 | 属性型 | 説明 | 必須かどうか | API バージョン | 通用範囲 |
|---|---|---|---|---|---|
| axis | String |
このグラフの系列のバインド先の軸。グラフの 4 辺の境界の 1 つである必要があります。
|
はい | 26.0 | |
| colorSet | String | レベル領域の塗りつぶしの色として順に使用される一連の色の値。色は、HTML スタイル (16 進) の色をカンマ区切りで指定します。たとえば、#00F,#0F0,#F00 です。 | 26.0 | ||
| highlight | Boolean | マウスポインタを重ねたときに各レベルを強調表示するかどうかを指定する boolean 値。指定されていない場合、この値はデフォルトの true に設定されます。 | 23.0 | ||
| highlightLineWidth | Integer | レベルが強調表示されるときにレベルを囲む線の太さをピクセル単位で指定する整数。 | 26.0 | ||
| highlightOpacity | String | レベルが強調表示されるときにレベル上に重ねる色の不透明度を表す 0 ～ 1 までの小数値。 | 26.0 | ||
| highlightStrokeColor | String | レベルが強調表示されるときにレベルを囲む線の HTML スタイルの色を指定する文字列。 | 26.0 | ||
| id | String | ページの他のコンポーネントがグラフコンポーネントを参照できるようにする識別子。 | 26.0 | グローバル | |
| opacity | String | この系列のレベルの塗りつぶされた領域の不透明度を表す 0 ～ 1 までの小数値。 | 26.0 | ||
| rendered | Boolean | グラフでグラフ系列を表示するかどうかを指定する boolean 値。指定されていない場合、この値はデフォルトの true に設定されます。 | 26.0 | ||
| rendererFn | String | 各データポイントが表示される方法を追加または上書きする JavaScript 関数の名前を指定する文字列。追加のスタイルを指定またはデータを追加するために実装します。 | 26.0 | ||
| showInLegend | Boolean | このグラフ系列をグラフの凡例に追加するかどうかを指定する boolean 値。指定されていない場合、この値はデフォルトの true に設定されます。 | 26.0 | ||
| tips | Boolean | マウスポインタを重ねたときに各データポイントマーカーのツールチップを表示するかどうかを指定する boolean 値。ツールチップの形式は xField: yField です。指定されていない場合、この値はデフォルトの true に設定されます。 | 26.0 | ||
| title | String | このグラフ系列のタイトル。グラフの凡例に表示されます。 yField の複数のデータ系列を使用する積み上げグラフの場合、各系列のタイトルをカンマで区切ります。例: title="MacDonald,Picard,Worle"。 |
26.0 | ||
| xField | String | 系列のデータポイントごとの X 軸の値の取得元である、グラフデータに指定された各レコードの項目。この項目はグラフデータのすべてのレコードに存在している必要があります。 | はい | 26.0 | |
| yField | String | 系列のデータポイントごとの Y 軸の値の取得元である、グラフデータに指定された各レコードの項目。この項目はグラフデータのすべてのレコードに存在している必要があります。 | はい | 26.0 |