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.CT", value: 15},
11
{id: "AU.VI", value: 23},
12
{id: "AU.WA", value: 86},
13
{id: "AU.QL", value: 16},
14
{id: "AU.NS", value: 32},
15
{id: "AU.NT", value: 64},
16
{id: "AU.TS", value: 28},
17
{id: "AU.SA", value: 45}
18
];
19
20
var map = anychart.map();
21
map.geoData(anychart.maps.australia);
22
23
var series = map.choropleth(data);
24
series.fill('#ADEB85')
25
26
//create a function what to listen and then unlisten
27
var func_listen = function(e){
28
pi = e.pointIndex;
29
if (pi) {
30
series.fill('#FFC9A8');
31
} else{
32
series.fill('#ADEB85')
33
}
34
};
35
36
//add a listener
37
var listener = map.listen('mouseOver', func_listen);
38
39
map.listenOnce('click',function() {
40
//adding an unlistener
41
map.unlisten('mouseOver', func_listen);
42
});
43
44
map.container("container");
45
map.draw();
46
});