이미지(Image)를 격자(Grid)와 함께 표시하기

2차원 데이터에 대한 이미지(Image)를 표출하는데 있어서 격자(Grid)를 함께 표시하는 방식은 이미지를 구성하는 각각의 화소(Pixel)를 사각형으로 둘러싸서 다른 화소들과 구분하여 보고자 할 때 유용합니다. 이러한 표출은 이미지 배열의 크기가 큰 경우보다는 작은 경우에 더 적합합니다. 물론 통상적으로는 이미지의 표출에 있어서 격자를 함께 표시하지 않는 것이 기본이긴 하지만, 필요에 따라서는 개별 화소를 구분하여 볼 목적으로 격자들을 함께 표시하고 싶을 수도 있습니다. IDL에서도 이러한 방식의 표출은 가능합니다. 그래서 그 방법을 소개해보고자 합니다.

 

먼저 가상의 예제 데이터를 다음과 같이 생성해봅시다. 여기서는 5x5의 구조를 갖는 2차원 배열 data를 생성하면서 화소값들은 난수로 부여되도록 하였습니다.

 

data = RANDOMU(-1, 5, 5)*10

 

그러면 이 데이터를 이미지의 형태로 표출해봅시다. 기본적으로는 IMAGE 함수를 사용하면 되는데 그 과정은 다음과 같이 처리해봅시다.

 

win = WINDOW(DIMENSIONS=[600, 600], /NO_TOOLBAR)
i = IMAGE(data, RGB_TABLE=74, $
  MARGIN=0.1, /CURRENT)

 

이 내용은 그냥 통상적인 방식의 표출입니다. 결과는 다음 그림과 같습니다.

 

 

그러면 이번에는 이미지 상에 격자를 입히는 과정으로 갑니다. 가장 먼저 할 일은 IMAGE 함수 내에서 AXIS_STYLE 키워드를 2로 설정하여 이미지에 X축 및 Y축이 추가되도록 하는 것입니다. 이를 위하여 앞서 IMAGE 함수가 사용된 내용만 다음과 같이 변경해봅시다.

 

i = IMAGE(data, RGB_TABLE=74, $
  AXIS_STYLE=2, MARGIN=0.1, /CURRENT)

 

이러한 변경사항을 반영하여 다시 실행해보면 결과는 다음 그림과 같습니다.

 

 

맨 처음과 비교하면 뭔가 변화가 생긴 것은 맞지만, 목적 달성을 위해서는 추가적인 설정들이 더 필요합니다. 일단 마이너 눈금들은 제거하는 것이 좋습니다. 그러면서 메이저 눈금들에 대해서는 아예 그 길이를 최대로 늘리는 것이 필요할 것입니다. 따라서 IMAGE 함수가 사용된 내용을 이번에는 다음과 같이 변경해봅시다.

 

i = IMAGE(data, RGB_TABLE=74, $
  AXIS_STYLE=2, XMINOR=0, YMINOR=0, $
  XTICKINTERVAL=1, YTICKINTERVAL=1, $
  XTICKLEN=1, YTICKLEN=1, $
  MARGIN=0.1, /CURRENT)

 

여기서는 마이너 눈금들을 제거하기 위하여 XMINOR 및 YMINOR 속성을 0으로 설정하였습니다. 그리고 메이저 눈금들의 길이를 최대로 늘리기 위하여 XTICKLEN 및 YTICKLEN 속성을 1로 설정하였습니다. 그 외에도 메이저 눈금들의 간격이 1이 되도록 하는 설정을 명시적으로 하기 위하여 XTICKINTERVAL 및 YTICKINTERVAL 속성을 1로 설정하였습니다. 이러한 변경사항들을 반영하여 다시 실행해보면 결과는 다음 그림과 같습니다.

 

 

이 그림을 보면 우리가 의도했던 것처럼 이미지를 표출하면서 각각의 화소들을 격자로 나눈 것과 같은 결과를 얻었다고 볼 수 있습니다. 그리고 격자선의 두께를 조정하는 것도 가능합니다. 이를 위해서는 XTHICK 및 YTHICK 속성의 값을 조정하면 됩니다. 예를 들어 다음과 같이 이 속성들의 값을 디폴트인 1보다 더 큰 5로 설정해봅시다.

 

i = IMAGE(data, RGB_TABLE=74, $
  AXIS_STYLE=2, XMINOR=0, YMINOR=0, $
  XTICKINTERVAL=1, YTICKINTERVAL=1, $
  XTICKLEN=1, YTICKLEN=1, $

  XTHICK=5, YTHICK=5, $
  MARGIN=0.1, /CURRENT)

 

그러면 격자선이 더 두꺼워진 다음과 같은 그림을 얻을 수 있습니다.

 

 

이번에는 크기가 더 큰 배열 데이터를 대상으로 해봅시다. 이를 위하여 앞서 맨 처음에 배열 data를 정의했던 부분만 다음과 같이 수정해봅시다.

 

data = RANDOMU(-1, 20, 20)*10

 

이와 같이 이번에는 20x20의 크기를 갖는 배열 데이터를 대상으로 해보았습니다. 이와 같이 데이터 배열만 바꾸고 전 과정을 다시 실행해봅시다. 다만 격자들이 더 많아진다는 것을 고려하여 격자선의 두께는 5 대신 3으로 하향 조정하기로 합니다. 그 결과는 다음 그림과 같습니다.

 

 

물론 크기가 더 큰 배열에 대해서도 이러한 방식의 표출 자체는 가능합니다. 하지만 배열 크기가 크면 아무래도 격자들이 많아지면서 격자선들이 차지하는 공간이 더 늘어나기 때문에 개별 화소의 모습이 상대적으로 가려질 가능성이 높습니다. 예를 들어 다음과 같이 100x100의 크기인 배열을 대상으로 하게 되면 그 결과는 다음 그림과 같습니다(격자선의 두께는 디폴트인 1로 처리합니다).

 

data = RANDOMU(-1, 100, 100)*10

 

 

거의 이 정도까지가 그나마 가독성이 보장되는 한계일 것 같습니다. 물론 이 그림의 경우는 각 축의 라벨 문자들이 너무 붙어서 겹쳐보이는 문제도 있기 때문에 이를 해소하기 위한 추가적인 코딩이 더 필요할 것으로 보이긴 합니다. 그리고 만약 크기가 더 큰 배열(200x200, 300x300 또는 그 이상)을 대상으로 하게 되면 격자선을 표시하지 않고 그냥 통상적인 방식으로 화소들만 보이도록 하는 것이 더 바람직할 것입니다. 어쨌든 크기가 그다지 크지 않은 2차원 데이터를 이미지의 형태로 표출하면서 각 화소별로 격자로 둘러싸는 방식의 표출이 필요할 경우에는 오늘 소개된 방법을 참조해보시면 좋을 것 같습니다.

 

 

* 이 글이 도움이 되었다면 게시물에 대하여 공감 버튼(하트 모양) 클릭 및 블로그 구독도 해주시면 더 큰 힘이 됩니다. 감사합니다.