그누보드5에 구글차트 넣기 > 그누보드5 팁자료실

그누보드5 팁자료실

그누보드5에 구글차트 넣기 정보

그누보드5에 구글차트 넣기

첨부파일

챠트.png (74.5K) 13회 다운로드 2018-09-21 04:17:09
구글차트.zip (925byte) 53회 다운로드 2018-09-21 04:17:09

본문

그누보드5에 구글챠트를 이용해서 간단한 그래프를 넣는 방법입니다.

index.php에서 최신글 부분을 삭제하고 구글챠트 코드를 넣은 것입니다.

타이틀, 세부통계목이나 width, height는 적당히 조절하시면 됩니다.

 

<?php
include_once('./_common.php');

define('_INDEX_', true);
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가

if(defined('G5_THEME_PATH')) {
    require_once(G5_THEME_PATH.'/index.php');
    return;
}

if (G5_IS_MOBILE) {
    include_once(G5_MOBILE_PATH.'/index.php');
    return;
}

include_once(G5_PATH.'/head.php');
?>

 

<h1 id="chart" style="font-style:italic;">그누보드5에 Google Charts 사용하기</h1>
<br>

<div id="piechart"></div>

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<script type="text/javascript">
// Load google charts
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);

// Draw the chart and set the chart values
function drawChart() {
  var data = google.visualization.arrayToDataTable([
  ['Task', '전체통계 '],
  ['10권이상', 2],
  ['3권이내', 2],
  ['구입않음', 6],
 
]);

  // Optional; add a title and set the width and height of the chart
  var options = {'title':'시집구입통계 ', 'width':875, 'height':600};

  // Display the chart inside the <div> element with id="piechart"
  var chart = new google.visualization.PieChart(document.getElementById('piechart'));
  chart.draw(data, options);
}
</script>


<?php
include_once(G5_PATH.'/tail.php');
?>

추천
6
  • 복사

댓글 5개

© SIRSOFT
현재 페이지 제일 처음으로