Visualforce 開発者ガイド
japex:barSeries
Visualforce グラフで棒として表示するデータ系列です。少なくとも、各棒の X 値および Y 値として使用するデータコレクションの項目、および目盛りとして使用する X 軸および Y 軸を指定する必要があります。グループ化または積み上げ棒区���をグラフに追加するには、複数の Y 値を追加します。各区分には新しい色が使用されます。
注: このコンポーネントは <apex:chart> コンポーネントで囲む必要があります。1 つのグラフに複数の <apex:barSeries> コンポーネントおよび <apex:lineSeries> コンポーネントを含めることができます。<apex:areaSeries> コンポーネントと <apex:scatterSeries> コンポーネントを追加できますが、判読しにくい結果になる可能性があります。
例
1<!-- Page: -->
2<apex:chart height="400" width="700" data="{!data}">
3 <apex:axis type="Numeric" position="left" fields="data1"
4 title="Opportunities Closed" grid="true"/>
5 <apex:axis type="Numeric" position="right" fields="data3"
6 title="Revenue (millions)"/>
7 <apex:axis type="Category" position="bottom" fields="name"
8 title="Month of the Year"/>
9 <apex:barSeries title="Monthly Sales" orientation="vertical" axis="right"
10 xField="name" yField="data3">
11 <apex:chartTips height="20" width="120"/>
12 </apex:barSeries>
13 <apex:lineSeries title="Closed-Won" axis="left" xField="name" yField="data1"/>
14</apex:chart>属性
| 属性名 | 属性型 | 説明 | 必須かどうか | API バージョン | 通用範囲 |
|---|---|---|---|---|---|
| axis | String | このグラフの系列のバインド先の軸。グラフの 4 辺の境界の 1 つである必要があります。
この軸のバインド先は同階層の <apex:axis> コンポーネントによって定義される必要があります。 |
はい | 23.0 | |
| colorSet | String | 棒の塗りつぶしの色として順に使用される一連の色の値。色は、HTML スタイル (16 進) の色をカンマ区切りで指定します。たとえば、#00F,#0F0,#F00 です。 | 26.0 | ||
| colorsProgressWithinSeries | Boolean |
colorSet 属性の色をどのような順序で使用していくかを指定する boolean 値。
|
26.0 | ||
| groupGutter | Integer | 棒のグループの間隔を棒の幅のパーセントで指定する整数。 | 26.0 | ||
| gutter | Integer | 個々の棒の間隔を棒の幅のパーセントで指定する整数。 | 26.0 | ||
| highlight | Boolean | マウスポインタを重ねたときに各棒を強調表示するかどうかを指定する boolean 値。指定されていない場合、この値はデフォルトの true に設定されます。 | 23.0 | ||
| highlightColor | String | 棒が強調表示されるときに棒の上に重ねる HTML スタイルの色を指定する文字列。 | 26.0 | ||
| highlightLineWidth | Integer | 棒が強調表示されるときに棒を囲む線の太さをピクセル単位で指定する整数。 | 26.0 | ||
| highlightOpacity | String | 棒が強調表示されるときに棒の上に重ねる色の不透明度を表す 0 (透明) ～ 1 (不透明) までの小数値。 | 26.0 | ||
| highlightStroke | String | 棒が強調表示されるときに棒を囲む線の HTML スタイルの色を指定する文字列。 | 26.0 | ||
| id | String | ページの他のコンポーネントがグラフコンポーネントを参照できるようにする識別子。 | 23.0 | グローバル | |
| orientation | String | グラフの棒の方向。有効なオプションは、次のとおりです。
|
はい | 23.0 | |
| rendered | Boolean | グラフでグラフ系列を表示するかどうかを指定する boolean 値。指定されていない場合、この値はデフォルトの true に設定されます。 | 23.0 | ||
| rendererFn | String | 各棒が表示される方法を追加または上書きする JavaScript 関数の名前を指定する文字列。追加のスタイルを指定またはデータを追加するために実装します。 | 26.0 | ||
| showInLegend | Boolean | このグラフ系列をグラフの凡例に追加するかどうかを指定する boolean 値。指定されていない場合、この値はデフォルトの true に設定されます。 | 23.0 | ||
| stacked | Boolean | 棒の値をグループ化するか積み上げるかを指定する boolean 値。 | 26.0 | ||
| tips | Boolean | マウスポインタを重ねたときに各棒のツールチップを表示するかどうかを指定する boolean 値。ツールチップの形式は xField: yField です。指定されていない場合、この値はデフォルトの true に設定されます。 | 23.0 | ||
| title | String | このグラフ系列のタイトル。グラフの凡例に表示されます。 yField の複数のデータ系列を使用する積み上げグラフの場合、各系列のタイトルをカンマで区切ります。例: title="MacDonald,Picard,Worle"。 |
23.0 | ||
| xField | String | 系列のデータポイントごとの X 軸の値の取得元である、グラフデータに指定された各レコードの項目。この項目はグラフデータのすべてのレコードに存在している必要があります。 | はい | 23.0 | |
| xPadding | Integer | 左軸および右軸とグラフの棒の間のパディングをピクセル単位で指定する整数。 | 26.0 | ||
| yField | String | 系列のデータポイントごとの Y 軸の値の取得元である、グラフデータに指定された各レコードの項目。この項目はグラフデータのすべてのレコードに存在している必要があります。 | はい | 23.0 | |
| yPadding | Integer | 上軸および下軸とグラフの棒の間のパディングをピクセル単位で指定する整数。 | 26.0 |