Coronavirus-Tracking-Web/indo.html

94 lines
2.3 KiB
HTML

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Indonesia Map</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<style src="map.css" type="text/css"></style>
</head>
<body>
<div id="container" width="600px" height="200px"></div>
</body>
<script src="https://code.highcharts.com/maps/highmaps.js"></script>
<script src="https://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="https://code.highcharts.com/mapdata/countries/id/id-all.js"></script>
<script>
var data = [
['id-ac', 5], //Aceh
['id-jt', 63], //Jawa Tengah
['id-be', 0], //Bengkulu
['id-bt', 106], //Banten
['id-kb', 8], //Kalimantan Barat
['id-bb', 0], //Bangka Belitung
['id-ba', 10], //Bali
['id-ji', 90], //jawa Timur
['id-ks', 1], //Kalimantan Selatan
['id-nt', 0], //NTT
['id-se', 47], //Sulawesi Selatan
['id-kr', 5], //Kep.Riau
['id-ib', 2], //Irian Jaya Barat
['id-su', 8], //Sumatera Utara
['id-ri', 2], //Riau
['id-sw', 2], //Sulawesi Utara
['id-ku', 2], //Kalimantan Utara
['id-la', 1], //Maluku Utara
['id-sb', 5], //Sumatera Barat
['id-ma', 1], //Maluku
['id-nb', 2], //NTB
['id-sg', 3], //Sulawesi Tenggara
['id-st', 2], //Sulawesi Tengah
['id-pa', 9], //Irian jaya
['id-jr', 149], //Jawa Barat
['id-ki', 17], //Kalimantan timur
['id-1024', 4], //Lampung
['id-jk', 675], //Jakarta
['id-go', 0], //Gorontalo
['id-yo', 22], //Jogjakarta
['id-sl', 2], //Sumatera Selatan
['id-sr', 1], //Sulawesi Barat
['id-ja', 1], //Jambi
['id-kt', 7] //kalimantan tengah
];
// Create the chart
Highcharts.mapChart('container', {
chart: {
map: 'countries/id/id-all'
},
title: {
text: 'Corona Virus Indonesia'
},
subtitle: {
text: 'Source map: <a href="http://code.highcharts.com/mapdata/countries/id/id-all.js">Indonesia</a>'
},
mapNavigation: {
enabled: true,
buttonOptions: {
verticalAlign: 'bottom'
}
},
colorAxis: {
min: 0
},
series: [{
data: data,
name: 'Positif',
states: {
hover: {
color: '#BADA55'
}
},
dataLabels: {
enabled: true,
format: '{point.name}'
}
}]
});
</script>
</html>