한약정보연구회지 (Kor Herb Med Inf). 2013;1. 25 한약재분포시각화를위한 SVG 형식활용 최고야 * 한국한의학연구원한약자원그룹 Scalable Vector Graphics for Infographics on Distributions of Korean Herbal Medicines Choi Goya * Herbal Medicine Resources Group, Korea Institute of Oriental Medicine Abstract One of the visualization techniques, SVG (scalable vector graphics), was used to introduce how to build the distribution of Korean herbal medicine on the map. The XML-based vector image format was employed to explain how the distribution of herbal medicine was created on the SVG maps that highlighted the locations in south Korea. The areas, endemics, and local productions of Korean herbal medicines as well as a variety of informations were visualized using SVG format. In addition, the appendix about local distribution of Korean herbal medicines was provided on the map. SVG format could help to visualize and create local distributions of Korean herbal medicines on the map. Keywords: Scalable vector graphics(svg), Korean herbal medicine 서론 정보를표현하는방법에는숫자, 문자, 기호, 도형, 도표, 그림등수많은종류가있다. 정보의규모가 단순하다면간단한숫자나문자로도충분히표현할수있지만, 규모와형식이복잡한정보라면텍스트 ( 숫자+ 문자) 로표현하는것에한계가있다. 또한방대한정보를단순텍스트로표현할경우정보소비 자의입장에서는특히비효율적이다. 따라서정보소비자가쉽게파악하기어려운정보를효과적으로 표현하기위해그림이나사진을활용한시각화작업이널리행해지고있다. 이러한정보의시각화를 인포메이션그래픽(information graphics) 또는인포그래픽 (infographics) 이라고하며, 차트, 지도, 다 이어그램, 흐름도등이이에속한다 1). * 최고야한국한의학연구원한약자원그룹 Correspondence: (Choi Goya). (Herbal Medicine Resources Group, Korea Institute of Oriental Medicine) Tel: 042-868-9348 Fax: 042-868-95410 E-mail: serparas@kiom.re.kr Received 2013-08-30, accepted 2013-09-03.
26 최고야. 한약재분포시각화를위한 SVG 형식활용. 한약재의생산지분포에서도이러한인포그래픽을활용하면효과적인정보전달이가능하다. 예컨대, 특정한약재의생산지분포확인, 식물학적분포구계와작물로서의산지분포를비교할경우, 표본 채집지역기록등지도에기반한인포그래픽이유용할때가많다. 그런데일반적으로인포그래픽은 컴퓨터그래픽등전문기술을필요로하기때문에연구자들이직접필요에따라제작하는것이원활하 지않다. 그러므로한약관련연구자가논문, 보고서, 발표자료등에활용가능한한약재생산분포도를 쉽게작성하는데도움을주고자 SVG 형식을이용한분포지도제작방법을소개하고자한다. 본론 1. SVG 형식이란? 인포그래픽의활용도는다양하며, 논문에서는흔히피겨(figure) 라지칭되는것이모두인포그래픽이 라할수있다. 그런데현대의문서는대부분전자파일에기반하고있으며, 인포그래픽또한전문소프 트웨어를활용해제작하는그림파일형식이다. 그림파일형식은크게비트맵기반형식과벡터기반 형식으로나눌수있다. 비트맵기반형식은 BMP, JPG, GIF, PNG 등의확장자를갖는가장널리 쓰이는형식이지만, 이미지크기에비례해서용량이늘어나고작은이미지를확대할경우매끄럽지 못하게출력되는단점이있다. 또한일부내용을간단히수정할경우에도전문소프트웨어를이용해야 하는번거로움이있다. 이에반해벡터기반형식은이미지크기에제한이없어확대또는축소시에도매끄러운결과물을 출력한다. 벡터기반형식에는 SWF, VML, VRML, SVG 등이있는데, 이중특히 SVG(scalable vec- tor graphics) 형식은 W3C 컨소시엄에서개방형표준으로제안한형식으로서, XML 텍스트로이루어 진파일이기때문에일반텍스트편집기를통해서접근이가능하다는장점이있다 2). SVG 형식은현재 위키피디아등집단작업이이루어지는웹사이트에서지도작성의권장형식으로이용되고있다. 2. SVG 형식파일활용실제 먼저, SVG 형식의그림파일을이용하기위해서는뷰어가필요하다. 고가의전문이미지소프트웨어 를이용할수도있지만, SVG 형식은 XML 기반이므로웹브라우저에서열수있다. 인터넷익스플로러 9 이상에서도지원하기는하지만, 완벽하게지원되는것은아니므로크롬웹브라우저를이용하는것을 권한다. 별도로제공된 SVG 파일을웹브라우저상에드래그- 앤-드롭하면그림 1과같이지도를확인 할수있다. 또한이를메모장등텍스트편집기로열면그림 2와같이 XML 코드를확인할수있다. 본예제파일은대한민국시도별지도로서, 초기상태에서는그림 1과같이시도별경계만표현되어 있으나, 내부적으로는전국시군별로구획이나뉘어있어각시군별색상을달리함으로써시군별 분포도를작성할수있다.
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 27 그림 1. SVG 예제( 대한민국시도별지도) SVG 파일은텍스트편집기에서 XML 코드를수정함으로써그림의변경이가능하다. 예제의지도 그림의경우, 시도별경계윤곽선은좌표로설정되어있어텍스트상수정이매우어렵지만, 각시도 또는시군의색상을달리표현하는것은매우간단하다. 텍스트편집기에서검색기능을통해색상을 달리표현하고자하는시도/ 시군을 id 로하는구획을찾은뒤, <g> 태그에 fill 속성을부여하면된다. 예컨대, 김포시의색상을검은색으로바꾸고자할경우, id= 김포 다음에 fill= black 이라는속성을 추가하고저장하면된다. 색상표현은 HTML 에서사용되는표준색상명칭( 예: black) 또는 16진수 RGB 값( 예: #000000) 을이용한다. 다만, 색상을달리표한하고자하는시군이많을경우 fill= 속성을일일이입력하는것이번거로우 므로, 미리지정해둔스타일클래스를활용하면편리하다. 코드윗부분의 <style> 태그안에기재된 l0부터 l10 까지의값이스타일클래스이며, 각시군별구획의기본스타일은 l0 클래스로지정되어 있다. 예제의클래스 l1부터 l10까지의색상은희미한하늘색으로부터강한청색까지점진적으로진해 지는청색계열색상이다. 예컨대, 김포시의색상을짙은청색으로바꾸고자할경우, id= 김포 다음의 class= l0 을 class= l10 으로바꾸고저장하면된다. 이지정된스타일클래스의색상을변경하려면 <style> 태그내의각클래스의 fill: 속성에원하는색상을기재하면된다. 예컨대클래스 l5의색상을 짙은적색으로변경하려면.l5 {fill:#ff0000} 또는.l5 {fill:red} 로바꾸면된다. 이처럼각시군의색상을달리표현함으로써, 표본채집지역, 한약재특산지, 특정한약재의지역별 생산량분포등다양한정보를손쉽게시각화할수있다.
28 최고야. 한약재분포시각화를위한 SVG 형식활용. 그림 2. SVG 예제의 XML 코드 3. 단점 SVG 형식은근본적으로는이미지라기보다텍스트에가까운파일이고, 수정작업에최소한의 XML 문법지식을필요로한다. 또한이미지확인이비교적번거롭고, 이미지뷰어와이미지형식변환기가 원활하게작동하지않을경우가있다는단점이있다. 예컨대, 예제파일을크롬브라우저에서열면 정상적으로보이지만, 다른브라우저에서는검정색으로표시되는경우가있다. 또한본예제와같이 시군별로만구획을지정한경우, 시군단위이하의지역을표시하려면해당좌표를지정하여구획을 설정하거나, 이미지캡처후다른소프트웨어에서표현을해주어야하는어려움이있다. 4. 여기서소개한기법을이용해작성한 2010 년도전국한약재(56 종) 재배량분포도(2010 년도농림 부통계 3) 기반) 를부록으로첨부하였다.
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 29 결론 한약관련연구에서지도를이용한시각화기법의한가지로 SVG 형식을이용한분포도제작법을 소개하고자하였다. SVG 형식은 XML 문법에기반한벡터그래픽형식으로서, 텍스트편집기를이용 하여 XML 코드를간단히수정함으로써분포도의작성이가능하다. 이를통해표본채집지역, 한약재 특산지, 지역별한약재생산량분포등다양한정보를손쉽게시각화할수있다. 감사의글본연구는한국한의학연구원의 한의본초활용기반구축사업 - 혼오용다빈도약재의기원정립중심으로 ( 과제코드 : K13020) 에의하여수행되었음. 참고문헌 1. 정소영. 소셜미디어시대의인포그래픽경향분석에관한연구. 한국디자인문화학회지. 2012;18( 2):437. 2. 신정엽, 홍일영. 오픈환경에서웹기반상호작용방식의 GIS 시각화방법연구: 상용 GIS 시각화 솔루션과 SWF, SVG 의비교분석적고찰과탐색. 지리교육논집. 2006;50:52,54-5. 3. 약용작물종자보급센터. 약용작물종자종합정보시스템. 지역별현황전국. [ 웹사이트] 발행일미상 [2013.08.30. 검색]. http://www.hseed.kr/smc/grow/grow01.jsp
30 최고야. 한약재분포시각화를위한 SVG 형식활용. 부록 : 2010년약용작물재배실적 ( 농림부통계기반, 약명가나다순 ) 감초 제천시 212.8 영주시 23.4 평창군 12.6 상주시 5.3 영월군 3.4 강활 파주시 90.0 봉화군 59.3 홍천군 38.8 영양군 36.8 음성군 25.0 강황 광주광역시 188.5 임실군 19.7 강화군 14.0 정읍시 12.7 고창군 4.2
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 31 결명자 강진군 115.3 장흥군 19.0 영암군 15.4 임실군 10.0 구례군 1.9 고본 합천군 45.0 정선군 24.4 산청군 12.2 의령군 9.7 울진군 7.0 구기자 청양군 326.6 진도군 325.5 예산군 67.3 보령시 6.0 홍성군 2.4
32 최고야. 한약재분포시각화를위한 SVG 형식활용. 길경 거창군 743.2 정선군 566.9 홍천군 566.9 삼척시 438.0 화순군 319.6 단삼 거창군 3.0 당귀 홍천군 872.7 평창군 803.0 봉화군 297.4 정선군 281.3 금산군 126.8
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 33 당삼 정선군 22.8 거창군 3.3 합천군 1.7 무주군 1.4 금산군 0.8 대추 논산시 40.9 영천시 9.1 청주시 3.0 무주군 2.8 서산시 2.0 대황 의성군 7.5 청송군 4.1 영양군 3.0
34 최고야. 한약재분포시각화를위한 SVG 형식활용. 독활 임실군 392.2 여수시 284.1 금산군 149.7 보령시 99.8 산청군 54.3 두충 제천시 79.6 영양군 71.2 산청군 43.5 울진군 43.0 금산군 31.5 맥문동 밀양시 177.8 청양군 154.1 부여군 150.0 영천시 11.4 공주시 0.7
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 35 목단피 화순군 17.1 안성시 7.6 임실군 2.4 고흥군 0.7 영주시 0.2 백수오 영주시 16.9 산청군 5.9 거창군 0.4 백지 봉화군 42.3 산청군 35.2 화순군 34.7 영천시 23.9 영양군 22.4
36 최고야. 한약재분포시각화를위한 SVG 형식활용. 백출 화순군 23.0 산청군 9.0 상주시 7.8 영주시 2.2 평창군 2.0 복분자 고창군 4,893.5 정읍시 2,526.2 장성군 1,346.0 순창군 1,165.1 횡성군 307.6 사삼 양구군 753.3 울릉군 352.1 홍천군 157.8 횡성군 62.6 금산군 62.1
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 37 산수유 구례군 172.2 의성군 50.8 이천시 25.0 군위군 3.9 산청군 2.0 산약 안동시 2,930.3 진주시 1,521.2 영주시 250.0 인제군 166.3 여주군 164.8 삼백초 거창군 139.3 보은군 12.1 산청군 8.4 보성군 7.2 달성군 3.5
38 최고야. 한약재분포시각화를위한 SVG 형식활용. 상황 대전광역시 45.9 춘천시 19.2 부산광역시 9.2 고양시 7.5 고성군( 경남) 7.4 생강 태안군 2,305.8 안동시 1,220.0 김제시 612.5 예천군 453.0 진도군 253.5 석창포 제주시 83.3
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 39 시호 영천시 35.3 고흥군 18.7 삼척시 9.0 화순군 8.3 밀양시 5.0 식방풍 여수시 431.7 화순군 64.6 영주시 25.0 영천시 10.0 영양군 6.4 애엽 진도군 1,632.6 여수시 499.1 곡성군 200.0 강화군 100.4 정선군 34.7
40 최고야. 한약재분포시각화를위한 SVG 형식활용. 양유 정선군 2,256.5 서귀포시 1,308.1 횡성군 979.4 제주시 597.0 제천시 512.1 어성초 거창군 90.4 장흥군 50.5 임실군 12.0 영천시 11.3 달성군 10.5 영지 광주시 105.1 진안군 79.8 부여군 69.5 예산군 11.2 달성군 10.0
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 41 오가피 제주시 310.3 천안시 139.8 산청군 116.3 봉화군 94.4 장수군 85.8 오미자 상주시 669.3 거창군 493.9 무주군 468.6 인제군 200.6 문경시 184.0 옥죽 양평군 120.0 산청군 103.3 영주시 23.2 서천군 6.4 순천시 5.5
42 최고야. 한약재분포시각화를위한 SVG 형식활용. 우슬 금산군 4.9 영주시 0.5 제천시 0.4 안동시 0.3 의이인 연천군 522.8 제천시 189.2 영월군 141.7 화천군 99.9 진안군 86.9 익모초 영양군 0.5 제천시 0.3
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 43 자소엽 영천시 92.3 산청군 27.0 남원시 7.8 순창군 2.1 영덕군 2.0 작약 산청군 162.0 영주시 133.8 고흥군 79.6 영천시 78.7 의성군 66.1 지모 화순군 4.5 의성군 1.5 제천시 1.4
44 최고야. 한약재분포시각화를위한 SVG 형식활용. 지황 금산군 455.1 화순군 245.6 안동시 177.8 제천시 65.3 산청군 51.0 천궁 영양군 3,390.2 봉화군 131.1 제천시 49.1 안동시 37.9 산청군 36.0 천마 무주군 101,202.5 김천시 313.1 보은군 163.6 장수군 94.0 남원시 76.8
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 45 치자 완도군 50.9 거제시 13.3 택사 순천시 128.5 여수시 92.9 신안군 50.9 구례군 5.4 보성군 0.8 하수오 영주시 120.1 화순군 20.8 안동시 20.5 봉화군 11.7 옹진군 7.5
46 최고야. 한약재분포시각화를위한 SVG 형식활용. 한인진 강화군 88.0 경주시 54.0 의령군 51.0 산청군 9.1 서귀포시 3.5 현삼 안동시 0.3 형개 안동시 13.6 화순군 1.2
한약정보연구회지 (Kor Herb Med Inf). 2013;1. 47 홍화 영양군 13.3 의성군 5.9 함양군 2.8 서산시 1.4 창녕군 1.2 홍화자 고흥군 31.9 구례군 0.2 평택시 0.1 황금 화순군 49.3 고흥군 40.4 강진군 27.1 여수시 23.9 영암군 3.0
48 최고야. 한약재분포시각화를위한 SVG 형식활용. 황기 제천시 433.6 정선군 304.4 영월군 124.5 영주시 83.9 평창군 45.0 황정 제천시 121.8 삼척시 33.3 의성군 4.0 금산군 1.8 * 좌측에는생산량상위 5 개시군만기재함. ( 단위 : 톤) ** 농림부에집계된실적만반영되어있으므로실제생산량과는다를수있음. 사삼/ 양유, 애엽/ 한인진, 하수오/ 백수오, 옥죽/ 황정등은명칭의혼동으로인해집계가잘못되었을가능성이있음.