C#용 무료 차트 라이브러리 ZedGraph

C# 닷넷으로 응용 프로그램을 개발하다가 꺾은선 그래프나 바차트, 3D 차트등을 표시할 필요가 있을 경우에는 도구 상자에서 데이터>Chart 컨트롤을 추가하여 간편하여 차트를 추가할 수 있습니다.

System.Windows.Forms.DataVisualization.Charting 클래스를 통해서 윈도우 폼에 추가된 컨트롤에는 데이터베이스로 부터 전달받은 DataTable 오브젝트를 직접 설정할 수 있는 등 편리하게 도표를 개발할 수 있도록 도와줍니다. 이렇게 비주얼스튜디오에서 기본적으로 제공하는 차트 클래스는 윈도우 시스템에서는 문제가 없지만 크로스플랫폼 환경에서는 정상적으로 동작하지 않는 제약이 있습니다.  다시 말해서 리눅스의 mono 플랫폼에서는 정상적으로 동작하지 않는다는 문제가 있습니다. 아직 차트 기능 까지는 mono에 적용되지 않은 까닭이 아닐까 싶습니다. 그래서 대안으로 찾은 것이 오픈소스 C# 차트 라이브러리인 ZedGraph 입니다.

https://sourceforge.net/projects/zedgraph/

ZedGraph 는 위의 링크에서 소스만 받을 수도 있고 닷넷 DLL만 가져다 사용할 수도 있으며 여러 예제 코드를 통해서 여러 사용법을 참조할 수도 있습니다. 오픈 소스 라이선스는 LGPL2입니다. 실제로 사용해 보니 윈도우와 리눅스 모두에서 정상적으로 동작하고 여러 옵션도 있어서 닷넷 차트보다 괜쟎다 싶습니다.

필자의 경우에는 소스를 다운로드 받아서 솔루션에 추가>기존 프로젝트로 ZedGraph 프로젝트를 추가했습니다. 소스를 내려받아서 빌드하면 대상 프레임워크가 닷넷 2.0으로 되어 있는데 저의 경우에는 솔루션 전체를 ".NET Framework 4"에 맞추었기 때문에 ZedGraph로 대상 프레임워크를 동일하게 맞추어 주었습니다. 빌드 이전에 프로젝트 속성>서명에 기존의 어셈블리 서명이 있는데 체크를 해제해주어야 정상적으로 재빌드할 수 있으니 참고하셔야 합니다.

ZedGraph 프로젝트의 빌드가 성공하면 도구 상자에 컨트롤을 추가해서 기본 차트 컨트롤처럼 간편하게 차트를 추가할 수 있도록 합니다. 도구 상자에 컨트롤을 추가하려면 도구 상자를 열고 컨트롤을 추가하고 싶은 그룹에서 위의 그림과 같이 빈 영역에 우측 마우스를 클릭하여 컨텍스트 메뉴>항목 선택을 클릭합니다.

위의 그림처럼 항목 선택 창이 나오면 하단의 [찾아보기]를 눌러서 ZedGraph 프로젝트의 빌드 결과가 있는 디렉토리로 이동하여 ZedGraph.dll을 찾습니다.

ZedGraph.dll을 선택하면 위의 그림과 같이 ZedGraphControl을 확인할 수 있고 이 상태에서 하단의 [확인]을 누르면 도구 상자에서 ZedGraph 컨트롤을 확인할 수 있습니다.

디자이너 화면에서 위의 그림과 같이 ZedGraph 컨트롤을 끌어다 놓기 방식으로 추가하고 컨트롤의 크기를 조절합니다.

public Trend()
{
    InitializeComponent();

    GraphPane gp = chart1.GraphPane;
    gp.Title.IsVisible = false;
    gp.XAxis.Title.IsVisible = false;
    gp.YAxis.Title.IsVisible = false;
    gp.XAxis.Type = AxisType.DateAsOrdinal;
}

private void drawchart()
{
    GraphPane gp = chart1.GraphPane;
    gp.CurveList.RemoveRange(0, gp.CurveList.Count);
    DataTable dt = getTrendData(tagcnt);
    for (int i = 0; i < tagcnt; i++)
    {
        PointPairList list = new PointPairList();
        DataRow dr;
        for (int j = 0; j < dt.Rows.Count; j++)
        {
            dr = dt.Rows[j];
            list.Add(new XDate((DateTime)dr[0]), Convert.ToDouble(dr[i + 1]));
        }
        LineItem Curve = gp.AddCurve(qry_tag[i], list, tagcolor[i], SymbolType.None);
        Curve.Symbol.Fill = new Fill(Color.White);
    }
    chart1.AxisChange();
    chart1.Invalidate();
}

위의 예제 코드에서 윈도우폼이 초기화되는 시점에 차트의 기본 형태를 조절하는데 저의 경우에는 차트 제목과 X축, Y축의 레이블을 보이지 않도록 설정했고 X축이 시간데이터로 입력 자료에 맞게 적절하게 표시하도록 옵션을 지정했습니다.

차트를 출력하는 시점에서는 각 행이 날짜 컬럼 하나와 여러 데이터 컬럼으로 구성되는 DataTable로 정보를 받아오는데 이 정보를 PointPairList에 차례대로 담아서 AddCurve(레이블, 정보 리스트, 라인 색, 점 표시 구분)로 그래프를 추가했습니다. 이 방식으로 여러 그래프를 동시 출력할 수 있습니다.

위의 그림은 3가지의 데이터로 꺾은선 그래프를 출력한 예제입니다. 각 그래프의 범례는 상단에 표시 됩니다.