Dalam kegiatannya, kita seringkali dihadapkan pada tantangan untuk mengembangkan grafik scatter yang lebih interaktif dan informatif. Dalam artikel ini, kita akan membahas cara membuat custom data label dan marker dalam grafik scatter menggunakan Highcharts.

Menggunakan Data Label Custom

Untuk membuat custom data label, kita dapat menggunakan opsi formatter pada plotOptions -> scatter -> dataLabels. Pada saat itu, kita dapat mengakses properti point.name untuk mendapatkan nilai dari data label yang diinginkan.
Contoh:

plotOptions: {
 scatter: {
 dataLabels: {
 formatter: function() {
 return this.point.name;
 }
 }
 }
}

Dengan menggunakan opsi di atas, kita dapat menampilkan nama point dalam grafik scatter.

Mengubah Nama Point

Jika kita ingin mengubah nama point, kita dapat menggunakan properti name pada seri scatter. Contoh:

series: [
 {
 type: 'scatter',
 data: [...],
 name: 'Seri 1'
 }
]

Dengan menggunakan opsi di atas, kita dapat menampilkan nama seri dalam grafik scatter.

Menggunakan Marker Custom

Untuk membuat custom marker, kita dapat menggunakan properti marker pada seri scatter. Pada saat itu, kita dapat mengatur simbol marker menjadi 'circle' untuk membuat semua point menjadi titik.
Contoh:

series: [
 {
 type: 'scatter',
 data: [...],
 marker: {
 symbol: 'circle'
 }
 }
]

Dengan menggunakan opsi di atas, kita dapat membuat semua point dalam grafik scatter menjadi titik.

Kesimpulan

Dalam artikel ini, kita telah membahas cara membuat custom data label dan marker dalam grafik scatter menggunakan Highcharts. Dengan menggunakan opsi formatter pada plotOptions -> scatter -> dataLabels, kita dapat menampilkan nama point dalam grafik scatter. Sementara itu, dengan menggunakan properti marker pada seri scatter, kita dapat mengubah simbol marker menjadi 'circle' untuk membuat semua point menjadi titik.

Referensi

• Highcharts API Reference: series.scatter.name
• Highcharts API Reference: plotOptions -> scatter -> dataLabels -> formatter