------------------------------------------------------------------------------
String[] xAxisLabels = { "1998", "1999", "2000", "2001", "2002", "2003", "2004"};
String xAxisTitle = "Years";
String yAxisTitle = "Problems";
String title = "Micro$oft At Work";
DataSeries dataSeries = new DataSeries( xAxisLabels, xAxisTitle, yAxisTitle, title );
------------------------------------------------------------------------------
소스와 각 타이틀, 라벨이 쓰인 것을 보시면 어떤 위치에 들어가지 보이시겠죠.
● 기본도표작성순서
1. 기본DATA를 생성한다.
- 타이틀등 레이아웃에 관련된 값을 세팅한다.
- 변경되는 data들(실제 data)을 생성한다.
2. DATA SET을 생성한다.
- 생성된 값들로 도표에 관련된 data에 대한 설정을 한다.
- data들을 가지고 하나의 data set을 만든다.
3. 도표를 생성한다.
- 도표에 필요한 설정값들을 설정한다.
- 설정값과 data set으로 Chart 객체를 생성한다.
4. 이미지를 생성한다.
- 화면에 뿌려줄 이미지를 생성한다.
● Properties
■
공통 차트 설정(ChartProperties)
1. 모든 차트에서 공통적으로 사용될 수 있는 설정들을 정의합니다.
2. 타이틀관련(font, padding) 설정, 테두리관련(stroke, padding) 설정과 배경색을 지정합니다.
■ 범례 설정(LegendProperties)
1. 범례는 위의 이미지에서 [Bugs, Security Holes, Backdoors]가 쓰여지 있는 부분을 나타냅니다.
2. LegendProperties 클래스를 사용하고, AxisChart를 생성할 때 인자로 넘겨주게 됩니다.
당연하게 AxisChart를 만들때 null을 넣어주면 범례는 표시되지 않습니다.
그렇다면, 생성후 아무값도 설정하지 않고 AxisChart 생성시 넘겨주면 어떻게 될까요?
default 값으로 범례가 세팅되어서 표시 됩니다.
범례가 필요없다면 null을 꼭 넘겨주세요.
3. API를 보면 색깔, 배경, 둘레, 아이콘등을 조절 할 수 있다고 되어 있지만, 다 귀찮구...
두가지만 사용해 볼 생각입니다.
legendProperties.setPlacement( LegendAreaProperties.LEFT );
legendProperties.setNumColumns( 2 );
위에 것은 범례의 위치를 지정하는 구문이고 아래것은 범례의 컬럼 수를 지정하는 것입니다.
아래나 위에 있으면 범례가 한 줄로 쭉~~~ 나와도 상관 없지만,
왼쪽이나 오른쪽으로 이동한다면, 컬럼을 제한해야 겠죠.
■ 축관련 설정(AxisProperties)
1. 축을 가지고 있는 모든 도표에서 사용되는 설정입니다.
■ Pie Chart
1. jCharts에서는 크게 NonAxis Chart와 Axis Chart로 구분하는데, Pie는 NonAxis Chart임.
2. 파이는 특별하게 세팅해 줄 값이 없을것 같고, 있더라도 그냥 default로 사용해도 별 문제가 없을 듯.
3. 작업순서를 역순으로 작성해 보겠습니다.
1) 최종적으로 필요한 객체는 PieChart2D 입니다. 3D도 지원할 생각으로 이렇게 이름을 지은 것 같지만,
아직 API에는 존재하지 않네요. 이 객체를 생성하기 위해서는 4개의 객체가 필요합니다.
→ iPieChartDataSet (IPieChartDataSet) : chart를 그리기위한 데이터의 집합.
→ legendProperties (LegendProperties) : 범례관련 설정값 (범례값 아님)
→ chartProperties (ChartProperties) : chart관련 설정값
→ pixelWidth (int) : chart의 넓이
→ pixelHeight (int) : chart의 높이
2) 1)의 PieChart2D를 생성하기 위해서 가장 중요한 객체는 IPieChartDataSet입니다.
IPieChartDataSet은 interface로 이를 실제로 구현한 PieChartDataSet 을 생성해야 합니다.
→ chartTitle (String) : chart의 제목
→ data (double[]) : data값
→ legendLabels (String[]) : 범례값
→ paints (Paint[]) : 도표의 색깔들
→ pieChart2DProperties (PieChart2DProperties) : Pie Chart를 위한 설정값
3) PieChartDataSet을 생성하기 위해서 Pie Chart의 설정을 생성해야 합니다.
그역할을 하는 객체는 PieChart2DProperties 입니다.
border, currency, label type등의 설정이 가능합니다.
4) Chart로 표시하기 위한 double값을 1차원 배열로 생성한다.
4. 예제
// 4) 그래프의 data를 생성.
double[] data= { 81d, 55d, 39d, 20.6d };
//각 data의 Label생성.
String[] labels= { "BMW M5", "BMW M3", "Viper GTS-R", "Corvette Z06" };
//각 data의 색깔 세팅.
Paint[] paints= { Color.lightGray, Color.green, Color.blue, Color.red };
// 3) pie chart properties 생성.
PieChart2DProperties pieChart2DProperties= new PieChart2DProperties();
// 2) 지금까지 세팅한 값으로 DataSet생성
PieChartDataSet pieChartDataSet= new PieChartDataSet( "Cars That Own", data, labels, paints, pieChart2DProperties );
// 1) DataSet으로 PieChart 생성
PieChart2D pieChart2D= new PieChart2D( pieChartDataSet, new LegendProperties(), new ChartProperties(), 320, 320 );
//생성된 Chart를 화면에 표시
JPEGEncoder13.encode(pieChart2D, 1.0f, response.getOutputStream());
●Bar Chart
1. bar chart는 Axis Chart에 속합니다.
2. bar chart는 normal, clustered, stacked 의 3 종류를 지원합니다.
3 종류의 Bar Chart를 작성하는 것은 동일합니다.
단지, AxisChartDataSet을 생성할때 bar type과 type에 만든 properties를 사용하면됩니다.
♩ ChartType.BAR → BarChartProperties
♪ ChartType.BAR_STACKED → stackedBarChartProperties
♬ ChartType.BAR_STACKED → stackedBarChartProperties
3. 이것도 작업순서를 역순으로 작성해 보겠습니다.
1) 최종적으로 생성되는 객체는 AxisChart 입니다. 이 객체는 아래에서 계속 볼 Axis Chart
종류에 공통적으로 사용됩니다.
→ iAxisDataSeries (IAxisDataSeries) : Axis Chart를 그리기위한 data set
→ chartProperties (ChartProperties) : chart관련 설정값
→ axisProperties (AxisProperties) : Axis Chart에서 사용되는 설정값
→ legendProperties (LegendProperties) : 범례관련 설정값 (범례값 아님)
→ pixelWidth (int) : chart의 넓이
→ pixelHeight (int) : chart의 높이
2) 1)의 AxisChart를 생성하기 위해서 가장 핵심적인 객체는 IAxisDataSeries 이고 이 것은
interface이기 때문에 이를 구현한 AxisDataSeries를 생성해야 합니다.
하지만, AxisDataSeries는 label을 설정할 수 없기 때문에 이를 상속받아 확장한
DataSeries 를 생성합니다.
→ axisLabels (String[]) : label들
→ xAxisTitle (String) : x축 제목
→ yAxisTitle (String) : y축 제목
→ chartTitle (String) : chart 전체 제목
이렇게 생성된 DataSeries에 IAxisPlotDataSet 을 등록합니다.
interface인 IAxisPlotDataSet를 구현한 AxisChartDataSet 은 chart로 표시 할 data에
대한 정보를 가지고 있습니다.
→ data (double[][]) : 표시할 data의 2차원 배열
→ legendLabel (String[]) : 범례 값들
→ parints (Paint[]) : 막대별 색깔
→ chartType (ChartType) : chart의 형태를 나타내는 ChartType의 상태값
→ chartTypeProperties (ChartTypeProperties) : 해당 chart에 특화된 설정값
3) AxisDataSet을 생성하기 위핸 객체들을 생성합니다.
표시한 data, 범례 그리고 ChartTypeProperties를 생성합니다.
Bar Chart에 맞는 ChartTypeProperties는 BarChartProperties입니다.
4. 예제
// 3)
// datas
double[][] data = new double[][]{ { 250, 45, -36, 66, 145, 80, 55 },
{ 100, 20, 0, 50, 155, 90, 25 } };
// lebels - data의 개수와 label의 개수는 같아야 합니다.
String[] xAxisLabels = { "1998", "1999", "2000", "2001", "2002", "2003", "2004" };
// x축 제목
String xAxisTitle = "Years";
// y축 제목
String yAxisTitle = "Problems";
// 전체 제목
String title = "Micro$oft at Work";
// 범례 - 표실할 막대의 개수와 동일해야 함.
String[] legendLabels = { "Bugs", "Fixed" };
// 막대 색깔 - 범례와 동일한 개수
Paint[] paints = new Paint[]{ Color.blue.darker(), Color.red };
// Bar chart 속성
/* normal bar
BarChartProperties barChartProperties = new BarChartProperties();
AxisChartDataSet axisChartDataSet = new AxisChartDataSet( data, legendLabels, paints, ChartType.BAR, barChartProperties );
*/
// clustered bar
ClusteredBarChartProperties clusteredBarChartProperties = new ClusteredBarChartProperties();
AxisChartDataSet axisChartDataSet = new AxisChartDataSet( data, legendLabels, paints, ChartType.BAR_CLUSTERED, clusteredBarChartProperties );
/* stacked bar
StackedBarChartProperties stackedBarChartProperties = new StackedBarChartProperties();
AxisChartDataSet axisChartDataSet = new AxisChartDataSet( data, legendLabels, paints, ChartType.BAR_STACKED, stackedBarChartProperties );
*/
// 2)
DataSeries dataSeries = new DataSeries( xAxisLabels, xAxisTitle, yAxisTitle, title );
dataSeries.addIAxisPlotDataSet( axisChartDataSet );
// 1)
ChartProperties chartProperties = new ChartProperties();
AxisProperties axisProperties = new AxisProperties();
LegendProperties legendProperties = new LegendProperties();
AxisChart axisChart= new AxisChart( dataSeries, chartProperties, axisProperties, legendProperties, 350, 350);
JPEGEncoder13.encode(axisChart, 1.0f, response.getOutputStream());
●Line Chart
1. line chart는 Axis Chart에 속합니다.
2. line chart는 기본적으로 bar chart와 사용법이 동일합니다.
AxisChartDataSet을 생성할때 ChartType.LINE, LineChartProperties 를 사용하면 됩니다.
● 나가는말
이 문서만 보시고 API를 안 보신분들을 위해서 한가지만 더 말씀드리면, DataSeries라는 객체에 AxisChartDataSet을 등록할때 set 메소드가 아니라 add 메소드 입니다. 이런 이름을 지었다는 것은 여러개를 add할 수 있다는 말이 되겠죠. jCharts는 이렇게 add를 함으로써 여러 chart가 복합적으로 들어간 chart를 만들 수가 있습니다.
jCharts는 제가 보는 입장에서는 단순합니다. 그렇기 때문에 기능이 적을 수도 있지만, 단순한 그래프를 표현하는데는 부족함이 없을꺼라고 생각합니다. 게다가 현재 Radar Chart 가 포함된 1.0.0이 알파버젼으로 개발 중이고, 계속 발전할꺼라고 믿습니다.
※ 본 문서는 jCharts의 userGuide 0.3.0을 기반으로 제가 테스트하면서 작성한 문서입니다.
틀린 내용이 있는 경우 아래의 메일로 알려주세요.
==================================================
최초작성일 : 2004-10-22
최종수정일 : 2004-10-28 15:02:10
--------------------------------------------------
본 문서는 자유롭게 배포/복사 할 수 있으나 반드시
이 문서의 저자에 대한 언급을 삭제하시면 안됩니다.
(이 내용은 javaservice.net에서 copy.)
--------------------------------------------------
이호훈(siva6)
E-mail: siva6@dreamwiz.com==================================================
이 포스트를.. 이 포스트 담기 -->
