From 0e6cbd98b4aa075b35d31538bff48730723cf409 Mon Sep 17 00:00:00 2001
From: kazu634 <simoom634@yahoo.co.jp>
Date: Sun, 14 Jun 2020 12:33:03 +0700
Subject: [PATCH] =?UTF-8?q?=E6=95=A3=E5=B8=83=E5=9B=B3=E3=81=AE=E3=82=B0?=
 =?UTF-8?q?=E3=83=A9=E3=83=95=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../2020-06-13-different-types-of-graphs.md   | 55 +++++++++++++++++++
 1 file changed, 55 insertions(+)

diff --git a/content/labs/visualization/2020-06-13-different-types-of-graphs.md b/content/labs/visualization/2020-06-13-different-types-of-graphs.md
index ac7753c..dc28280 100644
--- a/content/labs/visualization/2020-06-13-different-types-of-graphs.md
+++ b/content/labs/visualization/2020-06-13-different-types-of-graphs.md
@@ -229,5 +229,60 @@ chart=true
 
 > 伝えたい内容は、2つのデータ項目間の比較でも推移でも偏りでもありません。「関係」というデータ同士のつながりです。
 
+{{<chart canvas="scatter-chart" height="200">}}
+  var ctx = document.getElementById("scatter-chart");
 
+  var myScatterChart = new Chart(ctx, {
+    type: 'scatter', 
+    data: { 
+      datasets: [
+        {
+          label: '1st Class',
+          data: [{x:90, y:82},{x:39, y:45},{x:63, y:65},{x:83, y:75},{x:83, y:95}],
+          backgroundColor: 'RGBA(225,95,150, 1)',
+        }, 
+        {
+          label: '2nd Class',
+          data: [{x:97, y:92},{x:63, y:70},{x:48, y:52},{x:83, y:79},{x:66, y:74}],
+          backgroundColor: 'RGBA(115,255,25, 1)',
+        }]
+    },
+    options:{
+      title: {
+        display: true,
+          text: 'Test Results'
+      },
+      scales: {
+        xAxes: [{        
+          scaleLabel: {             
+            display: true,          
+            labelString: 'English' 
+          },
+          ticks: {
+            suggestedMin: 0,
+            suggestedMax: 100,
+            stepSize: 10,
+            callback: function(value, index, values){
+              return  value
+            }
+          }
+        }],
+        yAxes: [{        
+          scaleLabel: {             
+            display: true,          
+            labelString: 'Math' 
+          },
+          ticks: {
+            suggestedMax: 100,
+            suggestedMin: 0,
+            stepSize: 10,
+            callback: function(value, index, values){
+              return  value
+            }
+          }
+        }]
+      }
+    }
+  });
+{{< /chart >}}