I am currently working on a project to create a comprehensive map of Korea using highchart.
One major challenge I have encountered is the absence of Dokdo on the standard map of Korea provided by highchart.
Is there a way for me to develop a map that includes Dokdo using the highchart platform?
Jsfiddle URL: https://jsfiddle.net/jsill2786/bsguoxhq/
(async () => {
const topology = await fetch(
'https://code.highcharts.com/mapdata/countries/kr/kr-all.topo.json'
).then(response => response.json());
// Prepare demo data. The data is joined to map using value of 'hc-key'
// property by default. See API docs for 'joinBy' for more info on linking
// data and map.
const data = [
['kr-4194', 10], ['kr-kg', 11], ['kr-cb', 12], ['kr-kn', 13],
['kr-2685', 14], ['kr-pu', 15], ['kr-2688', 16], ['kr-sj', 17],
['kr-tj', 18], ['kr-ul', 19], ['kr-in', 20], ['kr-kw', 21],
['kr-gn', 22], ['kr-cj', 23], ['kr-gb', 24], ['kr-so', 25],
['kr-tg', 26], ['kr-kj', 27]
];
let city_code = ['kr-kg', 'kr-cb', 'kr-so', 'kr-kn', 'kr-2685', 'kr-pu',
'kr-2688','kr-sj', 'kr-tj', 'kr-ul', 'kr-in', 'kr-kw', 'kr-gn', 'kr-cj',
'kr-gb', 'kr-tg', 'kr-kj']
let city_name = ['경기도', '전북', '서울', '경상남도', '전라남도', '부산',
'경상북도', '세종', '대전', '울산', '인천', '강원도', '충청남도', '제주도', '충청북도',
'대구', '광주광역시']
// Create the chart
Highcharts.mapChart('container', {
chart: {
map: topology
},
title: {
text: 'Highcharts Korea Map'
},
subtitle: {
// text: 'Source map: <a href="http://code.highcharts.com/mapdata/countries/kr/kr-all.topo.json">South Korea</a>'
},
mapNavigation: {
enabled: true,
buttonOptions: {
verticalAlign: 'bottom'
}
},
colorAxis: {
min: 0
},
series: [{
data: data,
name: 'Random data',
states: {
hover: {
color: '#BADA55'
}
},
dataLabels: {
enabled: true,
// format: '{point.name}',
formatter: function() {
for (let i = 0; i < city_code.length; i++){
if (this.point['hc-key'] === city_code[i]){
return city_name[i]
}
}
}
}
}]
});
})();