<div id="container"></div>
html, body, #container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
anychart.onDocumentReady(function () {
// This sample uses 3rd party proj4 component
// that makes it possible to set coordinates
// for the points and labels on the map and
// required for custom projections and grid labels formatting.
// See https://docs.anychart.com/Maps/Map_Projections
// data
var data = [
{'id': 'GB.DU', 'size': 3},
{'id': 'GB.HI', 'size': 1}
];
// create map chart
var map = anychart.map();
// set geodata using https://cdn.anychart.com/geodata/2.2.0/countries/australia/australia.js
map.geoData(anychart.maps['united_kingdom']);
//create bubble series
var series = map.bubble(data);
// set max and min bubble sizes
map.maxBubbleSize(35);
map.minBubbleSize(10);
// set container id for the chart
map.container('container');
// initiate chart drawing
map.draw();
});