色相、彩度、明度の公式

シェアする

  • このエントリーをはてなブックマークに追加
最近の記事
  • 8/22 【Neural Network Console】CPU/GPU処理の設定切替
  • 8/21 【Neural Network Console】Learning Rate(学習率)の設定
  • 8/20 ソニーの無償AIソフト Neural Network Consoleの入手ダウンロード、インストール
  • 8/20 Deep Learning
  • 8/20
  • 8/19 古いバージョンのVisual Studio Community/Expressの入手ダウンロード
  • 8/19 CUDAの入手、ダウンロード、インストール方法
  • 8/17 【C#.NET】マイクロソフト仕様のアフィン変換
  • 8/5 【C#】ファイルを開くダイアログボックスの表示
  • 8/2 キャノンプリンターのCDトレイはどこ?!
  • 7/6 【参考書籍】画像処理・機械学習プログラミング OpenCV 3対応
  • 6/20 【Python,matplotlib】動くグラフをAnimationGifに保存する方法
  • 6/17 シグモイド関数の微分
  • 6/15 シグモイド関数
  • 6/13 合成関数の微分
  • 6/12 WordPressで数式エディタ風に数式を入力したい
  • 6/11 PythonをVisual Studioでインストールする方法
  • 6/9 【Python】OpenCVをAnacondaでインストール(Windows編)
  • 6/6 【Python】Anacondaで複数バージョンの環境切り替え
  • 6/6 画像センシング展2017に出展します。
  • 6/1 【Office365】Web版Outlookのフォントサイズ変更
  • 6/1 【Anaconda】モジュールのアップデートでエラー発生
  • 6/1 【Anaconda】コマンドリストの表示
  • 5/29 Windows10パソコン購入
  • 5/24 Anacondaのアンインストール
  • 5/24 【Jupyter Notebook】新規プログラムの作成
  • 5/23 【Python】開発環境の構築
  • 5/23 Pythonはじめました
  • 4/6 【Office365】Web版Outlookのスレッド表示を解除する方法
  • 4/5 【Excel】フーリエ解析(FFT)
  • 3/20 Canny edge detection
  • 3/20 【Excel2016】分析ツールの表示
  • 3/5 【Visual Studio】黒い背景色を白に変更する方法
  • 2/8 【Windows10】拡張モニタに表示されたウィンドウを元に戻す
  • 2/7 複素数の計算
  • 1/18 【Excel】棒グラフの横軸の目盛を0始まりにする
  • 1/16 【Excel】フーリエ変換
  • 1/6 【OpenCV】疑似カラー(カラーマップ)
  • 11/8 【Visual Studio】検索結果のウィンドウ表示
  • 11/3 ニコン 一眼レフカメラ D5500レビュー
  • 10/26 カラーカメラはモノクロカメラを兼ねない
  • 9/6 (Free Soft)Animation GIF Builder
  • 8/30 【C#】タブの無いTabControlっぽいものを作る
  • 8/29 【OpenCvSharp】サンプルプログラムの公開
  • 8/28 【PowerPoint】部分的にカラーにする(セレクトカラー処理)
  • 8/27 【C#】引数の値渡し、参照渡し(ref, out)
  • 8/26 【Word/Excel】図形内に文字を挿入する
  • 8/25 【C#】NumericUpDownコントロール
  • 8/24 ニコン D3400 VS D5500 仕様比較
  • 8/22 【C#】MDIフォームにリサイズ可能なPanelを設置する

  • カラーの画像処理をする時には、これら色相などの知識は必須となります。
    Windows標準で付いてくるペイントで、色の作成の表示をすると、雰囲気が分かると思います。

    色相、彩度、明度の公式

    基本的に以下の色相、彩度、明度を用いて色を表すのですが、変換式にいくつかの種類があります。

    色相(Hue)

    色合いを表します。
    赤や緑、青などに色を0~360°(0~2π)の角度を用いて表します。

    彩度(Saturation)

    鮮やかさを表します。
    と一般的に言われるのですが、鮮やかさ?と言われても、いまいちピンと来ませんが、下記に示した式から見ても分かるように、R,G,Bの値にどれだけ開きがあるか?を示しています。
    このことは逆にいうと、R,G,Bの値に開きが無い場合は、グレーに近い事から、彩度は如何にグレーっぽく無いか?、という事から、どれだけ純色(赤、緑、青、黄、シアン、紫など)に近いか?を表しています。

    明度(Brightness,Lightness,Intensity,Value)

    色の明るさを表します。

    HSV変換

    6角錐モデルとも言います。

    【RGB⇒HSV変換】

    Imax = Max(R,G,B)
    Imin = Min(R,G,B)
    とすると

    R = Imaxのとき

    H = 60×(G – B) / (Imax – Imin)

    G = Imaxのとき

    H = 60×(B – R) / (Imax – Imin) + 120

    B = Imaxのとき

    H = 60×(R – G) / (Imax – Imin) + 240


    S = (Imax – Imin) / Imax


    V = Imax


    【HSV⇒RGB変換】

    h = floor(H / 60)     floor()は切り捨て処理
    P = V × (1 – S)
    Q = V × (1 – S × (H / 60 – h))
    T = V × (1 – S × (1 – H / 60 + h))
    とすると

    h= 0のとき

    R = V, G = T, B = P

    h= 1のとき

    R = Q, G = V, B = P

    h= 2のとき

    R = P, G = V, B = T

    h= 3のとき

    R = P, G = Q, B = V

    h= 4のとき

    R = T, G = P, B = V

    h= 5のとき

    R = V, G = P, B = Q


    HLS変換

    双6角錐モデルとも言います。

    【RGB⇒HLS変換】

    Imax = Max(R,G,B)
    Imin = Min(R,G,B)
    とすると

    R = Imaxのとき

    H = 60×(G – B) / (Imax – Imin)

    G = Imaxのとき

    H = 60×(B – R) / (Imax – Imin) + 120

    R = Imaxのとき

    H = 60×(R – G) / (Imax – Imin) + 240


    L = (Imax + Imin) / 2

    L ≦ 0.5のとき

    S = (Imax – Imin) / (Imax + Imin)

    L > 0.5のとき

    S = (Imax – Imin) / (2 – Imax – Imin)


    【HLS⇒RGB変換】

    h < 0のとき

    h’ = h  + 360

    h ≧ 360のとき

    h’ = h  – 360

    その他

    h’ = h

    L ≦ 0.5のとき

    M2 = L × (1 + S)

    L > 0.5のとき

    M2 = L + S – L × S


    M1 = 2 × L – M2


    h’ < 60のとき

    X = M1 + (M2 – M1) × h’ / 60

    60 ≦ h’ < 180のとき

    X = M2

    180 ≦ h’ < 240のとき

    X = M1 + (M2 – M1) × (240 – h’ ) / 60

    240 ≦ h’ ≦ 360のとき

    X = M1

    とすると

    R = X ただし、h = H + 120とする

    G = X ただし、h = Hとする

    B = X ただし、h = H – 120とする

    カラー変換用関数

    【Win32APIの場合】 VBの表記例
    ‘HLS変換(Windows 2000以降、またはInternet Explorer 5.0がインストールされてある環境。(SHLWAPI.DLL Version 5.00以上)
    ‘h (色相)
    ‘赤(0)、黄(40)、緑(80)、シアン(120)、青(160)、マゼンダ(200)の順に定義0~239まで設定可
    ‘L (明度)
    ‘色の明るさをあらわす。0~240まで設定可。0が黒、240が白になる。
    ‘s (彩度)
    ‘0~240まで設定可。240が純色になる。
    Public Declare Sub ColorRGBToHLS Lib “SHLWAPI.DLL” _

    (ByVal clrRGB As Long, _
    pwHue As Integer, _
    pwLuminance As Integer, _
    pwSaturation As Integer)

    Public Declare Function ColorHLSToRGB Lib “SHLWAPI.DLL” _

    (ByVal wHue As Integer, _
    ByVal wLuminance As Integer, _
    ByVal wSaturation As Integer) As Long

    最初に紹介したペイントの色の作成では、この関数と同様の変換(設定値を含めて同じ)をしています。

    【.NET Frameworkの場合】
    System.Drawing.Color構造体にて

    GetHueメソッド      HSBのH(色相)を取得
    GetSaturationメソッド   HSBのS(彩度)を取得
    GetBrightnessメソッド   HSBのB(明度)を取得

    RGB⇒HSB変換はなし?

    【OpenCVの場合】
    cvCvtColor関数にて、以下の変換に対応
    XYZ, YCrCb(YCC), HSV, HLS, L*a*b, L*u*v
    その他 同じcvCvtColor関数で Bayer変換に対応

    カラー画像処理例

    そのカラー画像を色相、彩度、明度に分解し、それぞれの値(主に色相)でフィルタリング処理(バンドパスフィルタ)を行い、カラー画像に逆変換する事により、特定の色だけを抽出する事が可能になります。これにより、色の位置や個数などの検査をする事が可能となります。

    色変換 色変換
    処理前 処理後

    ただし、彩度の値の小さな色(白やグレーに近い色)は彩度の値が不安的になりがちなので、カラー画像処理には不向きです。

    画像処理アルゴリズムへ戻る

    コメント

    1. umhr より:

      【RGB⇒HSV変換】のところ、「R = Imaxのとき」が二つあります。
      二つ目は、「B = Imaxのとき」ではないかと。

      また、【HSV⇒RGB変換】のところ、「T = V × (1 – S × (1 – H / 60 + h))」ではなくて、
      「T = V × (1 – S × (1 – (H / 60 + h)))」じゃないと、計算があいません。
      また、Sが0の場合、R=G=B=Vとなるのも加えたほうが良いと思います。

      参考
      http://ja.wikipedia.org/wiki/HSV%E8%89%B2%E7%A9%BA%E9%96%93

      • akira より:

        umhrさん。コメント頂きありがとうございます。
        ご指摘の通り、「R = Imaxのとき」は誤記でしたね。
        本記事も修正しました。
        また、Tの式についてですが、ここにある式であっていませんか?
        参考のページの式でもfを代入すると同じようになりましたが...
        R=G=Bの時は色相が不定になるので、扱いは迷ったのですが、認識はお任せします。

      • umhr より:

        おっと、HSV⇒RGB変換の方はこちらのミスでした。失礼しました。
        参考にして、作ってみました。
        http://www.mztm.jp/2013/07/15/dotsimage/

    2. […] かさ)、明度(Brightness,Lightness,Intensity,Value:明るさ)については、以前、変換式には色相、彩度、明度ほかのページにまとめたのですが、実は訳も分からず公式だけをまとめていました。 […]