SimpleBarChart
SimpleBarChartウィジェットは、値のリストを縦棒で描いてカテゴリー間の大きさを一目で比較できる、軽量なバーチャートです。
正の値と負の値を一緒に表示でき、棒ごとに色と幅を指定できます。
定義・役割
SimpleBarChartウィジェットは、値(value)に比例した高さの棒を並べて描きます。棒ごとに色・幅を個別に指定でき、基準線(0の線)の方式を選んで正の値と負の値の棒の配置を変えられます。
- カテゴリー: Contents
- パレット項目名:
SimpleBar
機能
| 機能 | 説明 |
|---|---|
| 棒データ | seriesに値・色・幅を持つ棒のリストを入れて棒を描きます。スクリプトから埋めることもできます。 |
| 基準線の方式 | baseStyleで0の線の位置を、底(zero)・中央(centerzero)・最小値基準(min)から選びます。 |
| 0の線の表示 | drawZeroLineをオンにすると、基準線を横線で描きます。 |
| 登場アニメーション | useAnimationをオンにすると、棒が0から伸びるアニメーションを再生します。 |
| 間隔・角 | spacingで棒の間隔を、radius・baseRadiusで棒の両端の角丸を調整します。 |
| 描画余白 | topInset・bottomInsetで上下の描画余白(%)を指定します。 |
使い方
- 左のウィジェットパレットでContentsカテゴリーを開きます。
SimpleBar項目をキャンバスにドラッグ&ドロップします。- 右のプロパティパネルで
seriesに棒データを追加するか、スクリプトでsetListData・setStringDataを呼び出して値を埋めます。 - 必要に応じて
baseStyle・spacing・radiusなどで見た目を調整します。
注記
スクリーンショット必要: 左のウィジェットパレットのContentsカテゴリーからSimpleBar項目をキャンバスにドラッグする様子
プロパティ
| プロパティ | 説明 | デフォルト値 | 値 / タイプ |
|---|---|---|---|
series | 棒のリスト。各項目は値(value)・色(color)・幅(width)を持ちます。 | 空のリスト | 棒データのリスト |
baseStyle | 基準線(0の線)の方式 | zero | zero, centerzero, min |
drawZeroLine | 基準線を横線で表示 | false | true / false |
useAnimation | 登場時に棒が伸びるアニメーションを使用 | false | true / false |
spacing | 棒の間隔 | 5 | 数値(0以上) |
radius | 棒の値側の端の角丸 | 未設定 | 数値(0以上) |
baseRadius | 棒の基準線側の端の角丸 | 未設定 | 数値(0以上) |
topInset | 上側の描画余白(%) | 未設定 | 数値(0~100) |
bottomInset | 下側の描画余白(%) | 未設定 | 数値(0~100) |
注意・ヒント
警告
seriesが空の場合、編集画面では「SimpleBarChart」の案内ボックスが表示され、実行画面では棒が描かれません。データを入れるとチャートが表示されます。
ヒント
radiusかbaseRadiusのどちらかを指定すると、棒は角丸で描かれます。両方とも未設定の場合は角のある四角形で描かれます。
さらに詳しく
ヒント
このウィジェットをスクリプトで制御するWidget Control(Property・Method・Event)の全体は、SimpleBarChart Widget Controlドキュメントで確認できます。