꺾은선형 그래프 생성 Google Charts

Google Charts를 사용하여 꺾은선형 그래프를 그립니다. 여기에서는 그래프 생성 Google Charts 에서 작성한 makeChart Parts() 함수로 그래프를 생성합니다. 예제의 데이터는 기온과 습도 때문에 가 스케일이 다르므로 세로 축을 좌우 별도로 설정합니다.

옵션의 'series'를 설정하여 세로 축을 2축화하고, 'vAxes'에서 자세한 내용을 설정합니다. 'series'에서 'targetAxisIndex'의 1은 'vAxes'에서의 인덱스에 해당됩니다. 'vAxes'의 인덱스 0은 기본의 좌측으로, 'series'에서 'targetAxisIndex'를 설정할 필요가 없습니다. 또한 표에 꺾은선형 그래프의 데이터도 표시합니다.

● 꺾은선형 그래프 생성하기

<?php

// 다른 파일의 사용자 정의 함수 "makeChartParts ()"를 읽어들입니다.

require_once './make_chart_parts.php';

// グラフの値

$data = array(

array('', '평균 기온', '평균 습도'),

array('1월', 4.5, 64), array('2월', 5.2, 61), array('3월', 8.7, 59),

array('4월', 14.4, 60), array('5월', 18.9, 65), array('6월', 22.7, 71),

array('7월', 26.4, 74), array('8월', 27.8, 70), array('9월', 24.1, 71),

array('10월', 18.1, 68), array('11월', 12.2, 66), array('12월', 7.0, 65));

// 그래프 옵션

$options = array(

'title' => '서울의 평균 온도와 습도 (1981 ~ 2010 년)', // 그래프 제목

'titleTextStyle' => array('fontSize' => 16), // 제목 스타일

'series' => array(1 => array('targetAxisIndex' => 1)), // 세로축을 2 축화

'vAxes' => array(0 => array('title' => '평균 기온（℃）', // 세로축 왼쪽

'minValue' => 0, 'minValue' => 40),

1 => array('title' => '평균 습도（％）', // 세로축 오른쪽

'minValue' => 40, 'maxValue' => 80)),

'width' => 550, 'height' => 340, // 폭, 높이

'chartArea' => array('width' => 460, 'height' => 240), // 차트 영역

'legend' => array('position' => 'in', 'alignment' => 'start')); // 범례

// 그래프 유형 (선 그래프)

$type = 'LineChart';

// 그래프 그림의 JavaScript 함수, 표시할 <div> 태그의 생성

list($chart, $chart_div) = makeChartParts($data, $options, $type);

// 두 번째 그래프는 첫 번째 그래프의 데이터를 테이블로 하기

$options = array('width' => 240); // 그래프 (테이블 세트) 옵션

$type = 'Table'; // 그래프 유형 (테이블 세트)

list($table, $table_div) = makeChartParts($data, $options, $type);

<!DOCTYPE html>

<head>

<?php

// 그래프 그리기 함수를 표시합니다.

echo $chart, $table;

</script>

</head>

<body>

<div>

<?php

// 차트를 표시 할 <div> 태그를 적당한 위치에 배치합니다.

echo $chart_div, $table_div;

</div>

</body>

</html>

저작자표시 비영리 변경금지

'웹코딩 > PHP' 카테고리의 다른 글

태그 없애기 strip_tags() 함수 (0)	2016.10.26
배열에서 라디오 버튼 생성 foreach (0)	2016.10.24
원형 그래프 생성 Google Charts (0)	2016.10.24
막대형 그래프 생성 Google Charts (2)	2016.10.24
배열로 받은 반환값을 변수에 대입 list() 함수 (0)	2016.10.22

Coding Everyday