히포 엔진(HippoEngine)으로 손쉽게 차트 데이터를 만들자!

히포엔진(HippoEngine)으로 손쉽게 차트 데이터를 만들자!!

 이번 강좌에서는 차팅 데이터를 만들어주는 히포 엔진에 대해 자세히 알아보겠습니다.

 앞선 시리즈 강좌에서 알았듯이 히포차트를 그리기 위해서는 데이터를 시리즈로 바꿔주는 작업이 필요했습니다. 데이터가 몇 개 안될 경우는 간단히 작업이 가능하겠지만 몇 백, 몇 천개일 경우는 죽음의 노가다 작업(-_-)이 될지도 모릅니다.

 위 이미지는 다양한 데이터가 히포 엔진을 통해 시리즈로 둔갑(?) 하여 히포차트 코어엔진으로 전달되어 차트를 그려내는 과정을 간략히 보여줍니다.

 히포 엔진에서는 다양한 데이터 소스를 지원하는데 현재(베타 2.0 기준) 아래 표와 같이 8가지를 지원하는데DataSourceType 이라는 열거형 속성으로 간단히 설정이 가능합니다.

히포 엔진 지원 데이터 소스

MSSQL  Oracle  Mysql  Access  Excel  XML  Array  DataTable

그럼, 하나씩 자세히 살펴보겠습니다.


1. 데이터베이스 (MSSQL, Oracle, Mysql)

 데이터 베이스(이하 DB)는 가장 많이 사용하는 MSSQL, Oracle, Mysql 총 3종류의 DB를 지원합니다. 물론 프로젝트에서 Data Access Layer 가 존재할 경우는 이 부분은 건너뛰셔도 좋습니다. 대표적으로 MS-SQL 의 예제를 살펴보면,

 위 예제 코드를 보시면 HippoEngine 이라는 클래스를 통해 시리즈 리스트를 받아오고 있습니다. 이 시리즈 리스트는 디자인 요소가 배제된 데이터만 세팅된 것으로서 세 번째 코드 블록에서 처럼 그 이후부터 디자인 요소를 세팅하고 마지막에 DrawChart() 를 호출하여 차트를 완성할 수 있습니다.

 GetSeriesList() 메소드는 총 10개의 메소드가 오버로드되어 있는데 위 예제는 아래와 같이 다양하게 호출이 가능합니다.

2. Excel 

 엑셀은 업무, 웹 환경 등에서 다양하게 활용되므로 가장 많이 사용하는 데이터 소스 중에 하나가 아닐까 생각합니다. 히포 엔진에서는 이러한 엑셀 타입의 데이터 소스 역시 지원하는데 다음 코드를 통해 알아보겠습니다.

 예제 코드에 보여지듯이 데이터소스타입을 Excel로 설정하고 엑셀 엔진 버전에 맞는 알맞은 연결문자열을 세팅한 후 쿼리를 날려 시리즈 리스트를 획득하시면 되겠습니다. 여기서 중요한 부분은 해당 엑셀 파일의 내용인데, 아래를 참조하시기 바랍니다.

이 그림은 엑셀 데이터의 상위 셀 부분인데 위 그림과 같이 가장 첫번째 셀은 컬럼 이름이 들어가야합니다.

이 그림은 엑셀의 가장 아래 부분 "시트 이름" 부분입니다. DB에 비유하자면 테이블 이름이 되겠네요.


3. 엑세스(Access)

 간단한 예제를 통해 엑세스 지원 방식을 알아봅니다.

 엑셀과 마찬가지로 실행되는 환경에 인스톨되어 있는 오피스의 버전이 중요한데 아래 내용을 참고하여 올바른 설정을 하시기 바랍니다.

Excel 2007(xlsx) Provider=Microsoft.ACE.OLEDB.12.0;Data Source=FilePath;Extended Properties="Excel 12.0;HDR=YES";   Excel 2003 이전(xls) Provider=Microsoft.ACE.OLEDB.12.0;Data Source=FilePath;Extended Properties="Excel 8.0;HDR=YES"; Provider=Microsoft.JET.OLEDB.4.0;Data Source=FilePath;Extended Properties="Excel 8.0;HDR=YES";

Access 2007(accdb) 파일 연결문자열 Provider=Microsoft.ACE.OLEDB.12.0;Data Source=FilePath; Provider=Microsoft.ACE.OLEDB.12.0;Data Source=FilePath;Jet OLEDB:Database Password=Password;   Access 2003 이전(mdb) 파일  연결문자열 Provider=Microsoft.ACE.OLEDB.12.0;Data Source=FilePath; Provider=Microsoft.ACE.OLEDB.12.0;Data Source=FilePath;Jet OLEDB:Database Password=Password; Provider=Microsoft.JET.OLEDB.4.0;Data Source=FilePath; Provider=Microsoft.JET.OLEDB.4.0;Data Source=FilePath;Jet OLEDB:Database Password=Password;

4.  XML 

 다음은 XML 지원 방식입니다.

 XML 은 여러가지 형태(문자열, 스트림 등) 으로 존재할 수 있으나 히포차트에서는 파일 형태의 XML을 지원합니다. 위 예제코드에 보여지듯이 다른 데이터 소스와는 달리 쿼리나 연결 문자열 같은 속성들은 세팅할 필요가 없는 대신 XML 파일 경로를 세팅하셔야 되겠습니다. 
 GetSeriesList() 에서 name과 values 라는 파라미터를 넘겨주고 있는데, 첫번째는 x축 이름 엘리먼트일 것이고, 두번째 values는 y축 값 엘리먼트 이름일 것입니다. 아래 샘플 xml 을 보시면 이해가 쉬우리라 봅니다. 

<?xml version="1.0" encoding="utf-8" ?> <root>   <data>     <idx>2</idx>     <name>Kaka'</name>     <values>23</values>     <values2>29.6</values2>   </data>   <data>     <idx>3</idx>     <name>Park</name>     <values>116.5</values>     <values2>48.3</values2>   </data> </root>

5. Array(배열)

 히포엔진에서는 배열을 통해 간단히 히포차트 데이터를 만들 수 있습니다.

위 예제 코드처럼 x축 이름 배열과 y축 값 배열을 넘김으로써 아주 간단히 시리즈 리스트를 획득할 수 있습니다. 오버로드 중 에는 names나 true가 생략된 메소드가 있어 취사 선택이 가능합니다.


6. DataTable (System.Data.DataTable)

 아무래도 가장 많이 사용될 것으로 보이는 데이터 타입입니다. 위에서 언급했듯이 프로젝트에는 데이터 베이스 엑세스를 다루는 모듈이 거의 있을 것이고 웹일 경우 DataSet, CS환경일 경우는 DataTable 로 데이터 소스를 반환 받을 것이기 때문입니다. 사용법은 간단합니다. 
 

 가장 간단히 보이는군요. 예제 코드처럼 개발자가 생성한 DataTable을 첫 번째 파라미터에 넣어 주기만 하면 되겠습니다.

 이상 히포차트 데이터 엔진인 히포 엔진(HippoEngine) 에 대해 알아보았습니다. 히포 엔진을 통해 보다 손쉽게 차트를 그릴 수 있었으면 좋겠네요. 궁금한 사항은 리플달아주세요.