PHP 플래시 차트 출력의 실제

"PHP로 오픈 플래시 차트 출력하기"와 "오픈 플래시 차트 예제 목록 - PHP"에 이어 플래시 차트 출력과 관련한 실제적인 사례를 다루어 볼까 합니다.

첫번째 예제는 각 항목의 색과 레이블을 지정하면서 파이 차트를 그리는 것입니다. 파이 차트를 그리면서 접히는 애니메이션 효과도 주고 마우스를 올렸을때 보이는 값 표시 형식도 변경합니다.

require_once('OFC/OFC_Chart.php');
$pie_labels = array("신규", "진행중", "거절", "완료"); 
$pie_clrs = array("#7EEE8E","#7EC9EE","#D67EEE","#EEE97E");
$pie_dat = array(35, 20, 10, 50);

$pie = new OFC_Charts_Pie();
$pie->set_start_angle( 15 );
$pie->set_animate( true );
$pie->tip = '#val# of #total#(#percent#)';
$pievals = array();
for ($i=0; $i < 4; $i++) {
    array_push($pievals, new OFC_Charts_Pie_Value($pie_dat[$i], $pie_labels[$i]));
}
$pie->values = $pievals;
$pie->colours = $pie_clrs;

$chart = new OFC_Chart();
$chart->set_title( "" );
$chart->add_element( $pie );
$chart->x_axis = null;

echo $chart->toPrettyString();

$pie_labels에 각 항목에 해당하는 레이블을 입력하는데 한글로 입력해도 무난하게 출력하는 것을 확인할 수 있습니다. 한글 입력시에 필자의 경우에는 텍스트 에디터에서 UTF-8 인코딩을 선택했습니다. 항목별 색 지정은 $pie_clrs 배열에 웹 표시 방식의 RGB 색상을 입력합니다.  주의할 점은 데이터 값을 입력하는 $pie_dat에는 반드시 숫자 값을 입력해야 합니다. $_GET 이나 $_POST로 넘겨진 웹 데이터를 배열을 통해 도표를 작성하는 경우 문자열인 경우 플래시에서 오동작할 수 있으므로 주의하셔야 합니다. 웹 데이터를 전달하는 경우 intval(), floatval()과 같은 변환 함수를 사용하거나 (int)"100" 처럼 캐스팅(Casting)하여 반드시 숫자 타입으로 데이터를 전달해야 합니다. 

$pie->tip으로 설정한 툴팁 형식은 #val, #total, #percent와 같이 미리 정의된 값을 원하는 스트링과 함께 출력하도록 설정합니다.  예제에서는 도표의 제목을 출력하지 않았지만 set_title에 제목을 전달하면 상단에 출력합니다.

두번째 예제는 각 바의 색을 다르게 하여 출력하는 바차트의 예제입니다.

require_once('OFC/OFC_Chart.php');
$bar_labels = array("신규", "진행중", "거절", "완료"); 
$bar_clrs = array("#7EEE8E","#7EC9EE","#D67EEE","#EEE97E");
$bar_dat = array(35, 20, 10, 50);

$bar_stack = new OFC_Charts_Bar_Stack();
for ($i=0; $i < 4; $i++) {
    $bar_stack->append_stack( array( new OFC_Charts_Bar_Stack_Value($bar_dat[$i], $bar_clrs[$i]) ) );
}

$y = new OFC_Elements_Axis_Y();
$ymax = max($bar_dat) + 1;
$y->set_range( 0, $ymax, $ymax/3 );

$x = new OFC_Elements_Axis_X();
$x->set_labels_from_array( $bar_labels );

$chart = new OFC_Chart();
$chart->set_title( "" );
$chart->add_element( $bar_stack );
$chart->set_x_axis( $x );
$chart->add_y_axis( $y );

echo $chart->toPrettyString();

파이 차트와 마찬가지로 UTF-8 인코딩으로 코드를 작성하면 플래시에서 정상적으로 한글을 표시할 수 있었습니다. 각 항목의 값별로 색과 레이블의 준비하고 값중에 최대값을 max 함수를 통해 추출하여 Y축의 범위와 안내선을 설정하는 방식입니다.