v5.20191.603
|

Color クラス

色を表します。

Color クラスは、CSS文字列として指定された色を解析し、 その赤、緑、青、およびアルファチャンネルを読み取り/書き込み可能なプロパティとして公開します。 また、Color クラスは、RGBではなくHSBカラーモデルとHSLカラーモデルを使用して 色を作成するためのfromHsb メソッドとfromHsl メソッド、 およびそれらのカラーモデルを使用して色要素を取得するための getHsb メソッドとgetHsl メソッドを提供します。 最後に、Color クラスは、HSLモデルを使用して2色間を補間することで 色を作成するinterpolate メソッドを提供します。 このメソッドは、animate メソッドでカラーアニメーションを作成する場合に特に便利です。 以下の例はこの仕組みを示します。

Example

階層

  • Color

コンストラクタ

プロパティ

メソッド

コンストラクタ

constructor

  • new Color(color: string): Color
  • CSS色指定から新しいColor を初期化します。

    引数

    • color: string

      CSS色指定。

    戻り値 Color

プロパティ

a

a: number

このColor のアルファ成分を0~1の範囲(0は透明、1は不透明)で取得または設定します。

b

b: number

このColor の青成分を0~255の範囲で取得または設定します。

g

g: number

このColor の緑成分を0~255の範囲で取得または設定します。

r

r: number

このColor の赤成分を0~255の範囲で取得または設定します。

メソッド

equals

  • equals(clr: Color): boolean
  • Color がこのColor と同じ値を持つ場合、trueを返します。

    引数

    戻り値 boolean

getHsb

  • getHsb(): number[]
  • この色のHSB成分を含む配列を取得します。

    戻り値 number[]

getHsl

  • getHsl(): number[]
  • この色のHSL成分を含む配列を取得します。

    戻り値 number[]

toString

  • toString(): string
  • このColor の文字列表現を取得します。

    戻り値 string

静的 fromHsb

  • fromHsb(h: number, s: number, b: number, a?: number): Color
  • 指定したHSB値を使用して新しいColor を作成します。

    引数

    • h: number

      色相(0~1)。

    • s: number

      彩度(0~1)。

    • b: number

      明度(0~1)。

    • オプション a: number

      アルファ(0~1)。

    戻り値 Color

静的 fromHsl

  • fromHsl(h: number, s: number, l: number, a?: number): Color
  • 指定したHSL値を使用して新しいColor を作成します。

    引数

    • h: number

      色相(0~1)。

    • s: number

      彩度(0~1)。

    • l: number

      輝度(0~1)。

    • オプション a: number

      アルファ(0~1)。

    戻り値 Color

静的 fromRgba

  • fromRgba(r: number, g: number, b: number, a?: number): Color
  • 指定したRGBA色チャネル値を使用して新しいColor を作成します。

    引数

    • r: number

      赤チャネルの値(0~255)。

    • g: number

      緑チャネルの値(0~255)。

    • b: number

      青チャネルの値(0~255)。

    • オプション a: number

      アルファチャネルの値(0~1)。

    戻り値 Color

静的 fromString

  • fromString(value: string): Color
  • CSS色文字列から新しいColor を作成します。

    引数

    • value: string

      CSS色指定を含む文字列。

    戻り値 Color

    A new Color, or null if the string cannot be parsed into a color.

静的 interpolate

  • 2つの色を補間することによって新しいColor を作成します。

    引数

    • c1: Color

      最初の色。

    • c2: Color

      2番目の色。

    • pct: number

      補間色を2番目の色にどれだけ近づけるかを指定する0~1の値。

    戻り値 Color

静的 toOpaque

  • toOpaque(c: any, bkg?: any): Color
  • 指定された色に最も近い不透過色を取得します。

    引数

    • c: any

      不透明色に変換するColor(文字列で色を指定することもできます)。

    • オプション bkg: any

      透過性の除去に使用する背景色(デフォルトは白)。

    戻り値 Color