pixels

캔버스의 각 픽셀의 색상을 포함하는 배열입니다.

색상은 빨강, 초록, 파랑 및 알파(RGBA) 값을 나타내는 숫자로 저장됩니다. 성능상의 이유로 pixels는 1차원 배열입니다.

pixels 배열에서 각 픽셀은 각 RGBA 값에 대해 네 개의 요소를 차지합니다. 예를 들어, 좌표 (0, 0)의 픽셀은 각각 pixels[0], pixels[1], pixels[2], pixels[3]에 RGBA 값을 저장합니다. 다음 좌표 (1, 0)의 픽셀은 각각 pixels[4], pixels[5], pixels[6], pixels[7]에 RGBA 값을 저장합니다. 이와 같이, 100×100 캔버스의 pixels 배열에는 100 × 100 × 4 = 40,000개의 요소가 있습니다.

일부 디스플레이는 단일 지점에서 색상을 설정하기 위해 여러 작은 픽셀을 사용합니다. pixelDensity() 함수는 캔버스의 픽셀 밀도를 반환합니다. 높은 밀도 디스플레이는 종종 pixelDensity()가 2입니다. 이러한 디스플레이에서 100×100 캔버스의 pixels 배열에는 200 × 200 × 4 = 160,000개의 요소가 있습니다.

캔버스의 한 지점의 RGBA 값을 액세스하려면 아래와 같이 약간의 수학이 필요합니다. pixels 배열에 액세스하기 전에 loadPixels() 함수를 호출해야 합니다. 어떤 변경 사항이든 발생한 후에는 updatePixels() 함수를 호출해야 합니다.