インジケーター付き円グラフウィジェットを使用すると、円グラフのスタイル、目標達成度、および必要に応じてその他のオプションをカスタマイズできます。
スタイル
- 基本属性
- Size:幅と高さを調整して、ウィジェットのサイズを設定します。
- Position:横座標と縦座標を調整して、ウィジェットの位置を設定します。
- Others:ウィジェットの回転角度と不透明度を設定します。
- テキスト領域
- フォントファミリ: 上下のラベルテキストのフォントを設定するには、ドロップダウン矢印をクリックして目的のフォントを選択します。 デフォルトのフォントは Microsoft YaHei です。
- フォントの色: 上下のラベルテキストのフォントの色を変更するには、 「カラーピッカー」をご参照ください。
- 目標テキスト: 下のラベルのテキストをカスタマイズできます。
- 現在の進行状況テキスト: 最上のラベルのテキストをカスタマイズできます。
- フォントサイズ: 上下のラベルテキストのフォントサイズを変更するには、値を入力するか、スライダをドラッグします。 値の範囲は 12 から 100 です。
- フォントの太さ: 上下のラベルテキストのフォントの太さを設定するには、ドロップダウン矢印をクリックしてターゲットのフォントの太さを選択します。
- チャート
- 進捗カラー
- 塗りつぶし
- グラデーション塗りつぶし: グラデーションカラーとして 2 色を選択できます。 グラデーション角度を変更するには、値を入力するか、スライダをドラッグします。 値の範囲は、0 から 360 です。
- 進行状況の背景色: ターゲットサークルの色を変更するには、「カラーピッカー」をご参照ください。
注 ターゲット円は進行円の下にあります。
- 越境色: 境界を越える円の色を変更するには、「カラーピッカー」をご参照ください。
注 実際の値が目標値を超えると、境界を越える円が表示されます。
- 内側の色: 内側の円の色を変更するには、「カラーピッカー」をご参照ください。
- 内側の線の色: 内側の線の色を変更するには、「カラーピッカー」をご参照ください。
- 内側のラベルの色: 内側の円のパーセント値の色を変更するには、「カラーピッカー」をご参照ください。
- フォントサイズ: 内側の円のパーセント値のフォントサイズを変更するには、値を入力するか、スライダをドラッグします。 値の範囲は 12 から 100 です。
- 枠のサイズ: 内枠と外枠の太さを設定するには、値を入力するか、 [+] または [-] をクリックします。
- マージン
- 上部: 円グラフと上部ラベルの間隔を設定するには、値を入力するか、 [+] または [-]をクリックします。
- 下部: 円グラフと下のラベルの間の距離を設定するには、値を入力するか、 [+] または [-]をクリックします。
- 進捗カラー
- アニメーション: アニメーションオプションを表示するには、 目アイコンをクリックします。
- 元の期間: ウィジェットが最初にアニメーションをレンダリングする期間を変更するには、値を入力するか、 [+] または [-] をクリックします。 単位はミリ秒です。
- イージング: アニメーションイージングを設定するには、ドロップダウン矢印をクリックして目的の効果を選択します。
- データアップデートの期間: データが変更になったときのアニメーション期間を変更するには、値を入力するか、 [+] または [-] をクリックします。 単位はミリ秒です。
- 最新の状態から更新: このオプションをオンにすると、アニメーションはデータが変更されたセグメントから始まります。 このオプションをオフにすると、アニメーションは開始点から始まります。
データ
- aims: 目標値
- actual: 進捗値 (実際のデータ値)
インタラクション
このウィジェットはまだイベントにバインドされていません。