XML/SWF Charts

간만에, SourceForge를 뒤지면서 Flash로 만든 오픈소스 차트를 찾아보다 XML/SWF Charts라는 제품을 발견하게 되었습니다. (사실은 ActionScript로 만든 애플리케이션 소스 보면서 공부해볼까하며 뒤지다가 샛길로 빠져버렸습니다. -_-;;)


 Introduction

maani.us의 XML/SWF Charts는 상당히 재미있는 제품입니다.
다른 차트들과는 다르게, charts.swf를 embed/object 태그로 삽입한 다음에, 라이브러리의 위치와 차트의 데이터를 지정하는 xml파일 위치만 지정해주면 화면에 차트를 표시해 줄 수 있는 구조입니다.

 License

기본라이센스는 몇가지 제약사항을 포함한 무료(Free License)입니다. 제약사항은 다음과 같습니다.

• XML/SWF Charts를 클릭하는 경우에, XML/SWF Charts 사이트로 이동하게됩니다.
  
• 다른 플래시 안에서 차트를 표시할 수 없습니다.
  
• 기술지원과 업데이트 정보를 얻을 수 없습니다.

유료 라이센스의 경우에도 하나의 도메인에 대한 $45짜리 라이센스와 무제한으로 사용가능한 $550짜리 두개로 나뉘어져 있습니다. (관련 링크)

 Usage

1. charts.swf를 사용할 html파일에 포함시킵니다.
2. charst.swf 사용에 필요한 라이브러리 파일과 차트의 데이타를 저장하는 xml파일의 위치를 지정합니다.

※ 차트 데이타를 저장하는 xml파일은 여러가지 파일을 담을 수 있습니다. 차트의 배경색이나, 차트타입, 카테고리값 등등등 여러가지 지정이 가능합니다.

xml파일 보기

<?xml version='1.0' encoding='UTF-8' ?>
<chart>
  <chart_data>
     <row>
        <null/>
        <string>2001</string>
        <string>2002</string>
        <string>2003</string>
        <string>2004</string>
     </row>
     <row>
        <string>Region A</string>
        <number>5</number>
        <number>10</number>
        <number>30</number>
        <number>63</number>
     </row>
     <row>
        <string>Region B</string>
        <number>100</number>
        <number>20</number>
        <number>65</number>
        <number>55</number>
     </row>
     <row>
        <string>Region C</string>
        <number>56</number>
        <number>21</number>
        <number>5</number>
        <number>90</number>
     </row>
  </chart_data>
</chart>

 Etc

사용해본 결과 색지정만 잘해준다면 상당히 만족스러운 결과를 얻을 수 있을 것 같더군요. 3D차트까지 지원이 되니깐요. 게다가, 세부 색상이나 글꼴지정부터, 이미지 삽입이나 라인차트와 컬럼차트를 함께 그릴 수 있는 등 다양한 세부항목을 지정할 수 있게 해줍니다. (세부항목 지정 프로그램만 만든다면, Office 97정도의 차트를 만들 수도??? ^^;;)

지원되는 차트 목록은 다음과 같습니다.
    * Line    * Column    * Stacked column    * Floating column    * 3D column
    * Stacked 3D column    * Parallel 3D column    * Pie    * 3D Pie    * Bar
    * Stacked bar    * Floating bar    * Area    * Stacked area    * Candlestick
    * Scatter    * Polar    * Mixed    * Composite    * Joined

출처: manni.us의 XML/SWF Charts