From c7a4a412a7d5612e2ad19f58546f1dbe95de4fcc Mon Sep 17 00:00:00 2001
From: Kouhei Maeda <mkouhei@palmtb.net>
Date: Fri, 16 Sep 2022 18:24:01 +0900
Subject: [PATCH] Fixes drawing a bar graph on Current Statistics.

Signed-off-by: Kouhei Maeda <mkouhei@palmtb.net>
---
 app/views/dashboard/bar_graph.html.erb | 90 ++++++++++++--------------
 app/views/dashboard/home.html.erb      |  1 +
 2 files changed, 42 insertions(+), 49 deletions(-)

diff --git a/app/views/dashboard/bar_graph.html.erb b/app/views/dashboard/bar_graph.html.erb
index ed8c550c0..b05cd8aaf 100644
--- a/app/views/dashboard/bar_graph.html.erb
+++ b/app/views/dashboard/bar_graph.html.erb
@@ -1,54 +1,46 @@
- <div id="column_chart"></div>
- <!-- Google Visualization JS -->
-<script type="text/javascript" src="https://www.google.com/jsapi"></script>
+<div id="column_chart"></div>
+<!-- Google Visualization JS -->
 
 <script type="text/javascript">
-   // google.load("visualization", "1", {packages:["corechart"]});
-  
- 
+  google.charts.load('current', {'packages':['corechart']});
+  google.charts.setOnLoadCallback(drawChart3);
 
-	function drawChart3() {
-     var data = google.visualization.arrayToDataTable([
-       ['Year', 'Visitors', 'Orders', 'Income', 'Expenses'],
-       ['2007', 300, 800, 900, 300],
-       ['2008', 1170, 860, 1220, 564],
-       ['2009', 260, 1120, 2870, 2340],
-       ['2010', 1030, 540, 3430, 1200],
-       ['2011', 200, 700, 1700, 770],
-       ['2012', 1170, 2160, 3920, 800], ]);
+  function drawChart3() {
+      var data = google.visualization.arrayToDataTable([
+	  ['Year', 'Visitors', 'Orders', 'Income', 'Expenses'],
+	  ['2007', 300, 800, 900, 300],
+	  ['2008', 1170, 860, 1220, 564],
+	  ['2009', 260, 1120, 2870, 2340],
+	  ['2010', 1030, 540, 3430, 1200],
+	  ['2011', 200, 700, 1700, 770],
+	  ['2012', 1170, 2160, 3920, 800], ]);
 
-     var options = {
-       width: 'auto',
-       height: '160',
-       backgroundColor: 'transparent',
-       colors: ['#b5799e', '#579da9', '#e26666', '#1e825e', '#dba26b'],
-       tooltip: {
-         textStyle: {
-           color: '#666666',
-           fontSize: 11
-         },
-         showColorCode: true
-       },
-       legend: {
-         textStyle: {
-           color: 'black',
-           fontSize: 12
-         }
-       },
-       chartArea: {
-         left: 60,
-         top: 10,
-         height: '80%'
-       },
-     };
+      var options = {
+	  width: 'auto',
+	  height: '160',
+	  backgroundColor: 'transparent',
+	  colors: ['#b5799e', '#579da9', '#e26666', '#1e825e', '#dba26b'],
+	  tooltip: {
+              textStyle: {
+		  color: '#666666',
+		  fontSize: 11
+              },
+              showColorCode: true
+	  },
+	  legend: {
+              textStyle: {
+		  color: 'black',
+		  fontSize: 12
+              }
+	  },
+	  chartArea: {
+              left: 60,
+              top: 10,
+              height: '80%'
+	  },
+      };
 
-     var chart = new google.visualization.ColumnChart(document.getElementById('column_chart'));
-     chart.draw(data, options);
-   }
-
-
-$(document).ready(
-  drawChart3()
-);
-
-</script>
\ No newline at end of file
+      var chart = new google.visualization.ColumnChart(document.getElementById('column_chart'));
+      chart.draw(data, options);
+  }
+</script>
diff --git a/app/views/dashboard/home.html.erb b/app/views/dashboard/home.html.erb
index c923c4949..e9d5a8604 100644
--- a/app/views/dashboard/home.html.erb
+++ b/app/views/dashboard/home.html.erb
@@ -31,6 +31,7 @@
   </div>
 </div>
 
+<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
 <script type="text/javascript">
 function makeActive(){
   $('li[id="home"]').addClass('active');