본문 바로가기

context.getImageData2

칼라 이미지를 Grayscale 이미지로 나타내기 칼라 이미지를 Grayscale 이미지로 나타내기 Grayscale이란 검은색(black)과 흰색(White)의 중간색인 회색(Gray)의 색상으로 이미지를 표현하는 것으로 빛의 강도(Intensity)를 기준으로 하며 0부터 255까지 즉, 256 단계로 검정색(0)과 흰색(255)을 표현하고 중간 단계인 128은 회색으로 표현합니다. 그래서 RGB 칼라 이미지를 Grayscale 형태의 이미지로 나타내기 위해서는 jQuery 같은 편리한 JavaScript 라이브러리를 이용하면 grayscale() 함수를 이용하여 처리하면 되겠지만 여기서는 순수 javascript를 이용하여 그 기능을 구현하는 방법에 대해서 소개합니다. RGB 색상값을 Gray 색상으로 바꾸는 방법은 다양한 형태가 존재하는데 가장 .. 2013. 8. 8.
11.2 픽셀(pixel)에 기반한 이미지 가공(Manipulation) 11.2 픽셀(pixel)에 기반한 이미지 가공(Manipulation) 왜 픽셀에 기반한 이미지 가공이 필요할까요? 간단한 예를 하나 들면 특정 영역을 밝게 하거나 어둡게 할 경우 지금까지 설명한 방법들로는 불가능합니다. 일반적인 픽셀(pixel) 기반 이미지 가공의 과정을 간략히 도식화하면 다음과 같습니다. 위와 같은 작업을 할 수 있도록 drawing context는 픽셀(pixel) 단위로 이미지를 가공하여 반영하는데 사용할 수 있도록 다음과 같은 4 가지 메서드를 제공합니다. imagedata = context.createImageData(sw, sh); imagedata = context.createImageData(imagedata); imagedata = context.getImageDat.. 2013. 8. 7.