HTMLcopy
1
<div id="container"></div>
CSScopy
6
1
html, body, #container {
2
width: 100%;
3
height: 100%;
4
margin: 0;
5
padding: 0;
6
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
3
// This sample uses 3rd party proj4 component
4
// that makes it possible to set coordinates
5
// for the points and labels on the map and
6
// required for custom projections and grid labels formatting.
7
// See https://docs.anychart.com/Maps/Map_Projections
8
9
var data = [
10
{'id': 'AU.WA', 'value': 300},
11
{'id': 'AU.NS', 'value': 240},
12
{'id': 'AU.VI', 'value': 75},
13
{'id': 'AU.NT', 'value': 130},
14
{'id': 'AU.TS', 'value': 190},
15
{'id': 'AU.CT', 'value': 150},
16
];
17
18
// create map
19
var map = anychart.map();
20
map.geoData(anychart.maps.australia);
21
22
// set the title and its preferences
23
map.title('Ordinal Color Scale');
24
25
// set the series
26
var series = map.choropleth(data);
27
28
// stroke disable
29
series.stroke("2 gray 0.4");
30
31
// set the colors and ranges for the scale
32
series.colorScale(anychart.scales.ordinalColor([{less:200,color:'#EC6E07'},{from:200, to:250, color:'#A1958A'},{greater:250, color:'#64B5F6'}]));
33
34
// set the container
35
map.container('container');
36
map.draw();
37
});