Dalam analisis data, grafik scatter (grafik titik) adalah salah satu jenis grafik yang paling umum digunakan. Grafik scatter digunakan untuk menganalisis hubungan antara dua variabel, yaitu x dan y, dengan setiap data point memiliki nilai x yang menentukan posisi di sumbu horizontal dan nilai y yang menentukan posisi di sumbu vertikal.

Fungsi Grafik Scatter

Grafik scatter digunakan untuk menganalisis hubungan antara dua variabel. Dalam grafik scatter, setiap data point memiliki nilai x dan y yang menentukan posisinya di dalam grafik. Grafik ini dapat membantu kita memahami hubungan antara dua variabel dan mengidentifikasi pola-pola yang terjadi di dalam data.

Contoh Penggunaan

Berikut adalah contoh penggunaan grafik scatter:

const data = {
 labels: ["JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"],
 datasets: [{
 label: 'Dataset 1',
 data: [{x:1, y:12}, {x:2, y:3}, {x:3, y:2}, {x:4, y:1}, {x:5, y:8}, {x:6, y:8}, {x:7, y:2}, {x:8, y:2}, {x:9, y:3}, {x:10, y:5}, {x:11, y:7}, {x:12, y:1}]
 }]
}

const config = {
 type: 'scatter',
 data,
 options: {
 responsive: true,
 maintainAspectRatio: false,
 },
}

const $canvas = document.getElementById('chart')
const chart = new Chart($canvas, config)

Dalam contoh di atas, kita menggunakan bibliotek Chart.js untuk membuat grafik scatter. Kami juga mengatur opsi responsive dan maintainAspectRatio agar grafik dapat menyesuaikan diri dengan ukuran layar.

Tipe Grafik Scatter

Grafik scatter memiliki beberapa tipe, seperti:

  • Tipe Scatter: Grafik scatter biasa
  • Tipe Line: Grafik scatter dengan garis yang menghubungkan data point
  • Tipe Bubble: Grafik scatter dengan bubblenya dapat diatur ukurannya

Properti Grafik Scatter

Grafik scatter memiliki beberapa properti, seperti:

  • markerType: Jenis marker untuk data point (contoh: circle, square, cross)
  • markerColor: Warna marker untuk data point
  • markerBorderColor: Warna border marker untuk data point
  • markerSize: Ukuran marker untuk data point
  • fillOpacity: Opasitas fill untuk grafik scatter

Contoh Penggunaan

Berikut adalah contoh penggunaan properti grafik scatter:

const config = {
 type: 'scatter',
 data,
 options: {
 responsive: true,
 maintainAspectRatio: false,
 markerType: 'circle',
 markerColor: 'red',
 markerBorderColor: 'blue',
 markerSize: 5,
 fillOpacity: 0.2
 },
}

Dalam contoh di atas, kita mengatur properti markerType menjadi circle, markerColor menjadi red, dan lain-lain.

Konklusi

Grafik scatter adalah salah satu jenis grafik yang paling umum digunakan untuk menganalisis hubungan antara dua variabel. Dalam artikel ini, kita telah membahas fungsi, contoh penggunaan, tipe, dan properti grafik scatter. Kita juga telah melihat cara membuat grafik scatter menggunakan bibliotek Chart.js.