Skip to content

その他のチャート設定

凡例設定

ts
type LegendSettings = {
  hide?: boolean;  // 凡例を非表示にする場合は true を指定
  position?: 'TOP' | 'BOTTOM' | 'LEFT' | 'RIGHT';  // 凡例の位置を指定(デフォルトは 'TOP')
  item_text_width?: number;  // 凡例の項目名の表示幅を制限したい場合に指定(px)
};

データズーム設定

ts
type DataZoomSettings = {
  enabled?: boolean;  // ズーム範囲をコントロールするUIを表示する場合は true を指定
  // 初期状態でズーム状態にする場合は、その範囲を(0〜100)で指定
  range?: {
    start?: number;  // 0 ~ 100
    end?: number;  // 0 ~ 100
  };
};

テキスト設定

チャート内のテキストのサイズを調整することができます。 ここで指定した基準フォントサイズを元に、各要素のテキストサイズを算出します。

ts
// 基準フォントサイズ
type BaseFontSize = 12 | 13 | 14 | 15;

type TextSettings = {
  base_font_size?: BaseFontSize;  // デフォルトは 12
};

色の指定

チャート内で色を指定する場合は、次の PaletteColorName を指定します。RGB値を直接指定するのではなく、テーマで指定されたカラーパレットのキーを指定します。

ts
type PaletteColorName =
  | 'SUCCESS'
  | 'WARN'
  | 'DANGER'
  | 'SERIES1'
  | 'SERIES2'
  | 'SERIES3'
  | 'SERIES4'
  | 'SERIES5'
  | 'SERIES6'
  | 'SERIES7'
  | 'SERIES8'
  | 'SERIES9'
  | 'SERIES10'
  | 'SERIES11'
  | 'SERIES12'
  | 'GRADIENT_HIGH'
  | 'GRADIENT_MID'
  | 'GRADIENT_LOW';