スポンサーリンク

JavaScriptで画像のヒストグラムの正規化

スポンサーリンク
HTML
スポンサーリンク

スポンサーリンク

概要

画像のヒストグラムを正規化するコードの紹介

サンプルソース

/**
 * メイン
 * @param {Object} canvas 
 * @param {Object} image 
 */
function main(canvas, image) {
  let ctx = canvas.getContext("2d");
  ctx.drawImage(image, 0, 0, image.width, image.height)
  let pixelValues = new Array(255).fill(0)
  let src = ctx.getImageData(0, 0, image.width, image.height)
  let dst = ctx.createImageData(image.width, image.height)

  let dMax = 255
  let dMin = 0
  let vMin = 255
  let vMax = 0

  const trans = (p) => (dMax - dMin) / (vMax - vMin) * (p - vMin) + dMin

  for (let i = 0; i < src.data.length; i += 4) {
    for (let c = 0; c < 3; c++) {
      let p = src.data[i + c]
      if (p > vMax) {
        vMax = p
      }
      if (p < vMin) {
        vMin = p
      }
    }
  }

  for (let i = 0; i < src.data.length; i += 4) {
    for (let c = 0; c < 3; c++) {
      dst.data[i + c] = parseInt(trans(src.data[i + c]), 10)
      pixelValues[dst.data[i + c]]++ // ヒストグラムの計算
    }
    dst.data[i + 3] = 255
  }
  ctx.putImageData(dst, 0, 0)
}
タイトルとURLをコピーしました