第10回 濃淡変換

課題 1 (元画像のヒストグラムを作る)

今日の課題では画像にいろいろな変更を加える。それによってヒストグラムがどう変わるかを調べるため、まずは元画像を用意し、そのヒストグラムをつくる。

  1. 以下のプログラムのコードをコピーし、Processingのエディタに貼り付ける。
  2. final float MAXN=20000; // 棒グラフの上端での縦軸の値(個)
    PImage img;
    size(600, 400);
    background(255); // 背景を白で塗りつぶす
    img = loadImage("1元.jpg"); // 画像情報をimgに入れる
    img.loadPixels(); // img.pixels[]に色情報を入れる(要素数は画像の横幅×高さ)
    int[] num = new int[256]; // それぞれの明るさのピクセルが何個あるかを入れる配列
    for (int i=0; i<img.width*img.height; i++) {
      color c = img.pixels[i];
      num[(int)(brightness(c))]++;
    }
    
    noStroke(); // 枠線を描かない
    
    // グラフ描画
    fill(128); // 塗りつぶし色を灰色にする
    beginShape(); // 図形描画開始
    vertex(0, height); // 左下の角
    for (int i=0;i<256;i++){
      vertex(i*width/255, height*(MAXN-num[i])/MAXN); // グラフ上の明るさがiにあたる位置の点
    }
    vertex(width, height); // 右下の角
    endShape(CLOSE); // 図形描画終わり
    save("data/1元.png"); // 結果を画像として保存
    
  3. 「ex10」という名前で保存する。
  4. 適当に画像検索してサンプル用の画像(デジカメで撮った写真のようなもの。極端に明るい部分や暗い部分がないものがよい)を用意する。
  5. 画像の形式に応じて以下の変更を加える。
  6. 1元.jpgをProcessingのエディタにドラッグ&ドロップする。
  7. プログラムを実行する(ヒストグラムが表示される)。
  8. ヒストグラムのピークが画面半分くらいの高さになるように最初の行の「MAXN=200000」の値を調整する。
    (数値を下げるとグラフは高く、数値を上げるとグラフは低くなる)
    (画像に真っ黒・真っ白なエリアがあると、左右の端が他よりも極端に高くなる。その場合はその部分を無視して、その他の部分のピークがちょうどよい高さになるようにする)
  9. プログラムのdataフォルダを開く(メニューの「スケッチ」→「スケッチフォルダーを開く」)。
  10. そのフォルダに「1元.jpg(元の画像)」「1元.png(実行結果と同じ画像)」があることを確認する。



  11. ここで作る提出物

課題 2 (画像の明度を変える)

GIMPの機能を使って明るさを変えたときに、ヒストグラムにどのような変化が起こるかを調べる。

  1. GIMPを起動する (Windowsボタン→「全てのプログラム」→「GIMP 2」)。
  2. dataフォルダにある「1元.jpg」をGIMPのメイン画面にドラッグ&ドロップする。
  3. メニューバーから「色」→「Brightness-Contrast」を選ぶ。


  4. 「Brightness」のところに「100」と入力してEnterキーを押し (メインの画面の画像が明るくなる)、OKボタンをクリックする。


  5. メニューバーから「ファイル」→「名前を付けてエクスポート」を選び、「2明.jpg」という名前でdataフォルダに書き出す。
  6. Ctrl+Zで元の状態に戻す
  7. ※ 次のステップでは暗い画像を作る。そのベースにしたいのは今作った明るい画像ではなく、元の画像。

  8. さっきと同様にして「Brightness」のところに「-100」と入力してEnterキーを押し (メインの画面の画像が暗くなる)、OKボタンをクリックする。


  9. メニューバーから「ファイル」→「名前を付けてエクスポート」を選び、「2暗.jpg」という名前でdataフォルダに書き出す。
  10. Ctrl+Zで元の状態(最初の画像の明るさ)に戻す
  11. ※この時点で、dataフォルダには4つの画像があるはず。サムネイルを見て、元画像より暗いもの、明るいものができていればOK。「2暗」が「1元」と同じように見えている場合は、6番目のステップを忘れている可能性が高い。


  12. Processingのプログラムの「1元.jpg」と「1元.png」の部分を、「2明.jpg」「2明.png」に書き換えてプログラムを実行する。
  13. final float MAXN=20000; // 棒グラフの上端での縦軸の値(個)
    PImage img;
    size(600, 400);
    background(255); // 背景を白で塗りつぶす
    img = loadImage("2明.jpg"); // 画像情報をimgに入れる
    img.loadPixels(); // img.pixels[]に色情報を入れる(要素数は画像の横幅×高さ)
    int[] num = new int[256]; // それぞれの明るさのピクセルが何個あるかを入れる配列
    for (int i=0; i<img.width*img.height; i++) {
      color c = img.pixels[i];
      num[(int)(brightness(c))]++;
    }
    
    noStroke(); // 枠線を描かない
    
    // グラフ描画
    fill(128); // 塗りつぶし色を灰色にする
    beginShape(); // 図形描画開始
    vertex(0, height); // 左下の角
    for (int i=0;i<256;i++){
      vertex(i*width/255, height*(MAXN-num[i])/MAXN); // グラフ上の明るさがiにあたる位置の点
    }
    vertex(width, height); // 右下の角
    endShape(CLOSE); // 図形描画終わり
    save("data/2明.png");
    

  14. dataフォルダに新しく「2明.png」ができていることを確認する。
  15. 同様に、プログラムでさっき変えた部分を、「2暗.jpg」「2暗.png」に書き換えて実行する。
  16. dataフォルダに新しく「2暗.png」ができていることを確認する。

  17. ※ 明るい画像のヒストグラム「2明.png」は、元画像のヒストグラム「1元.png」より右にずれているはず。
    ※ 暗い画像のヒストグラム「2暗.png」は、元画像のヒストグラム「1元.png」より左にずれているはず。
    ※ そうなっていない場合は、どこかで「Ctrl+Zで元に戻す」を忘れている。GIMPでCtrl+Zを連打して最初の状態に戻してやり直し。

    ここで作る提出物

課題 3 (画像のコントラストを変える)

GIMPの機能を使ってコントラストを変えたときに、ヒストグラムにどのような変化が起こるかを調べる。

  1. メニューバーから「色」→「Brightness-Contrast」を選ぶ。
  2. 「Contrast」のところに「50」と入力してEnterキーを押し (メインの画面の画像の色が鮮やかになる)、OKボタンをクリックする。


  3. メニューバーから「ファイル」→「名前を付けてエクスポート」を選び、「3鮮.jpg」という名前でdataフォルダに書き出す。
  4. Ctrl+Zで元の状態に戻す
  5. 同様にして「Brightness-Contrast」でContrastの値を-50にしてOKボタンをクリックする。

  6. メニューバーから「ファイル」→「名前を付けてエクスポート」を選び、「3鈍.jpg」という名前でdataフォルダに書き出す。
  7. Ctrl+Zで元の状態に戻す
  8. ※この時点で、dataフォルダには8つの画像があるはず。サムネイルを見て、元画像より鮮やかなもの、ぼんやりしたものができていればOK。「3鈍」が「1元」と同じように見えている場合は、4番目のステップを忘れている可能性が高い。また、「3鮮」「3鈍」のどちらも暗い場合は、課題2の最後に明るさを元に戻すのを忘れている可能性が高い。


  9. プログラムでさっき変えた部分を、「3鮮.jpg」「3鮮.png」に書き換えて実行する。
  10. dataフォルダに新しく「3鮮.png」ができていることを確認する。
  11. 同様に、プログラムでさっき変えた部分を、「3鈍.jpg」「3鈍.png」に書き換えて実行する。
  12. dataフォルダに新しく「3鈍.png」ができていることを確認する。

  13. ※ コントラストを上げた画像のヒストグラム「3鮮.png」は、元画像のヒストグラム「1元.png」に比べて左右に広がっているはず。
    ※ コントラストを下げた画像のヒストグラム「3鈍.png」は、元画像のヒストグラム「1元.png」に比べて中央に寄っているはず。
    ※ そうなっていない場合は、どこかで「Ctrl+Zで元に戻す」を忘れている。GIMPでCtrl+Zを連打して最初の状態に戻してやり直し。

    ここで作る提出物

課題 4 (ネガポジ反転)

  1. メニューバーから「色」→「Value Invert」を選ぶ。
  2. (これがネガポジ反転の操作にあたる。ただし、単純にR, G, B成分をそれぞれ反転させているわけではなく、色相を残したまま明るさだけを反転させる処理になる)
  3. メニューバーから「ファイル」→「名前を付けてエクスポート」を選び、「4反.jpg」という名前でdataフォルダに書き出す。
  4. Ctrl+Zで元の状態に戻す
  5. プログラムでさっき変えた部分を、「4反.jpg」「4反.png」に書き換えて実行する。
  6. dataフォルダに新しく「4反.png」ができていることを確認する。

  7. ※ ネガポジ反転した画像のヒストグラム「4反.png」は、元画像のヒストグラムと左右が反対になっているはず元画像のヒストグラムと比べると、ほぼ左右が反対になる。完全に反対にならないのは、色相を残したまま明るさを反転させるとR, G, Bの値が整数値にならないことがあり、丸め処理によってトゲ状のピークができてしまうため。ちなみに、グレースケール画像で同様の処理を行った場合はきれいに左右反転したグラフになる。


    ここで作る提出物

課題 5 (ポスタリゼーション)

  1. メニューバーから「色」→「Posterize」を選ぶ。
  2. そのままOKボタンをクリックする。
  3. メニューバーから「ファイル」→「名前を付けてエクスポート」を選び、「5減.jpg」という名前でdataフォルダに書き出す。
  4. Ctrl+Zで元の状態に戻す
  5. Processingのエディタに「5減.jpg」をドラッグ&ドロップする。
  6. プログラムでさっき変えた部分を、「5減.jpg」「5減.png」に書き換えて実行する。
    ※ ポスタリゼーションした画像のヒストグラムは、左端、中央、右端だけに山ができているはず。
  7. dataフォルダに新しく「5減.png」ができていることを確認する。



  8. ここで作る提出物

課題 6 (二値化)

  1. メニューバーから「色」→「Threshold」を選ぶ。
  2. そのままOKボタンをクリックする。
  3. メニューバーから「ファイル」→「名前を付けてエクスポート」を選び、「6二.jpg」という名前でdataフォルダに書き出す。
  4. プログラムでさっき変えた部分を、「6二.jpg」「6二.png」に書き換えて実行する。
    ※ 二値化した画像のヒストグラムは、左端、右端だけに山ができているはず。
  5. dataフォルダに新しく「6二.png」ができていることを確認する。



  6. ここで作る提出物

提出

戻る inserted by FC2 system