HighChart

HighChartウィジェットは、Highchartsライブラリで描画されるインタラクティブなチャートを画面に表示します。
棒・線・ゲージなどさまざまなチャートを、JSON定義と変数で構成してデータを可視化します。

備考

このウィジェットはFreeプランではロックされており、Pro・Enterpriseプランで使用できます。

定義・役割

HighChartウィジェットは、内部のWebViewにHighchartsのチャートをレンダリングします。チャート定義（JSONオプション）と変数リストでデータを構成します。編集画面ではプレースホルダーの枠として表示され、実行時に実際のチャートが描画されます。

• カテゴリー: Contents
• チャートエンジン: Highcharts

機能

機能	説明
インタラクティブなチャート	HighchartsベースのチャートをWebViewに描画して表示します。
データ変数のバインディング	チャート定義で宣言した変数にデータを連携させ、値を埋めます。
背景色の設定	チャート領域の背景色を指定します。
読み込み表示	チャートを読み込む間、ローディングインジケーターを表示するかを設定します。

使い方

1. 左のウィジェットパレットでContentsカテゴリーを開きます。
2. HighChart項目をキャンバスにドラッグ＆ドロップします。
3. 右のPropertiesパネルでチャートデータ（Highchart Data）を設定し、表示するチャートを定義します。
4. 必要に応じて、背景色（bgColor）・ローディング表示（showLoadingBar）を調整します。

プロパティ

プロパティ	説明	デフォルト値	値・タイプ
bgColor	チャート領域の背景色（不透明なRGBのみ適用 - 透明度・アルファ値は無視されます）	未設定	カラー
Highchart Data	チャート定義データ（JSONオプション＋変数リスト）	空のデータ	チャートデータ
showLoadingBar	チャートの読み込み中にインジケーターを表示するか	false（表示しない）	真／偽

注意・ヒント

ヒント

チャートデータに変数を宣言しておけば、スクリプトからその値を変更してチャートを再描画できます。

注記

チャートを読み込む間ローディングインジケーターを表示するには、showLoadingBarをオンにしてください。デフォルトはオフなので、設定しなければローディング表示は現れません。

さらに詳しく

ヒント

このウィジェットをスクリプトで制御するWidget Control（Property・Method・Event）の全体は、HighChart Widget Controlのドキュメントで確認してください。