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
var map = anychart.map();
4
map.geoData(anychart.maps.united_states_of_america);
5
6
flMap = anychart.map();
7
flMap.geoData(anychart.maps["florida"]);
8
9
txMap = anychart.map();
10
txMap.geoData(anychart.maps["texas"]);
11
12
// set the data for the USA map
13
dataSetUSA = [
14
{"id": "US.TX", "value": 26956958},
15
{"id": "US.FL", "value": 19552860}
16
];
17
18
// create data set for Texas districts
19
dataSetTX = [
20
{'id': 'US.TX.111', 'value': 6222}, // Dallam
21
{'id': 'US.TX.421', 'value': 3186}, // Sherman
22
{'id': 'US.TX.195', 'value': 5369}, // Hansford
23
{'id': 'US.TX.357', 'value': 9006}, // Ochiltree
24
{'id': 'US.TX.295', 'value': 3057}, // Lipscomb
25
{'id': 'US.TX.205', 'value': 5537}, // Hartley
26
{'id': 'US.TX.341', 'value': 20121}, // Moore
27
{'id': 'US.TX.233', 'value': 23857}, // Hatchinson
28
{'id': 'US.TX.393', 'value': 887}, // Roberts
29
{'id': 'US.TX.211', 'value': 3351}, // Hemphill
30
{'id': 'US.TX.359', 'value': 2185}, // Oldham
31
{'id': 'US.TX.375', 'value': 113546}, // Potter
32
{'id': 'US.TX.065', 'value': 6516}, // Carson
33
{'id': 'US.TX.179', 'value': 22744}, // Gray
34
{'id': 'US.TX.483', 'value': 5284}, // Wheeler
35
{'id': 'US.TX.117', 'value': 18561}, // Deaf Smith
36
{'id': 'US.TX.381', 'value': 104312}, // Randall
37
{'id': 'US.TX.011', 'value': 2148}, // Armstrong
38
{'id': 'US.TX.129', 'value': 3828}, // Donley
39
{'id': 'US.TX.087', 'value': 3206}, // Collingsworth
40
{'id': 'US.TX.369', 'value': 10016}, // Parmer
41
{'id': 'US.TX.069', 'value': 8285}, // Castro
42
{'id': 'US.TX.437', 'value': 8378}, // Swisher
43
{'id': 'US.TX.045', 'value': 1790}, // Briscoe
44
{'id': 'US.TX.191', 'value': 3782}, // Hall
45
{'id': 'US.TX.075', 'value': 7688}, // Childress
46
];
47
48
// create data set for Florida districts
49
dataSetFL = [
50
{'id': 'US.FL.063', 'value': 46755}, // Jackson]
51
{'id': 'US.FL.091', 'value': 170498}, // Okaloosa
52
{'id': 'US.FL.077', 'value': 7021}, // Liberty County
53
{'id': 'US.FL.079', 'value': 18733}, // Madison
54
{'id': 'US.FL.039', 'value': 45087}, // Gadsden
55
{'id': 'US.FL.067', 'value': 7022}, // Lafayette
56
{'id': 'US.FL.123', 'value': 19256}, // Taylor
57
{'id': 'US.FL.113', 'value': 117743}, // Santa Rosa
58
{'id': 'US.FL.029', 'value': 13827}, // Dixie
59
{'id': 'US.FL.037', 'value': 11057}, // Franklin
60
{'id': 'US.FL.131', 'value': 40601}, // Walton
61
{'id': 'US.FL.129', 'value': 22863}, // Wakulla
62
{'id': 'US.FL.005', 'value': 159238}, // Bay
63
{'id': 'US.FL.075', 'value': 34450}, // Levy
64
{'id': 'US.FL.083', 'value': 258916}, // Marion
65
{'id': 'US.FL.121', 'value': 34844}, // Suwannee
66
{'id': 'US.FL.065', 'value': 12902}, // Jefferson
67
{'id': 'US.FL.023', 'value': 56513}, // Columbia
68
{'id': 'US.FL.003', 'value': 22259}, // Baker
69
{'id': 'US.FL.073', 'value': 239452}, // Leon
70
{'id': 'US.FL.033', 'value': 294210}, // Escambia
71
{'id': 'US.FL.041', 'value': 14437}, // Gilchrist
72
{'id': 'US.FL.047', 'value': 13327}, // Hamilton
73
{'id': 'US.FL.013', 'value': 13017}, // Calhoun
74
{'id': 'US.FL.125', 'value': 13442}, // Union
75
{'id': 'US.FL.059', 'value': 18564}, // Holmes
76
{'id': 'US.FL.133', 'value': 20973}, // Washington
77
];
78
79
// Set the series for all maps
80
usaSeries = map.choropleth(dataSetUSA);
81
txSeries = txMap.choropleth(dataSetTX);
82
flSeries = flMap.choropleth(dataSetFL);
83
84
// enable the drilldown interactivity for the USA map
85
map.drillDownMap({
86
"US.TX": txMap,
87
"US.FL": flMap
88
});
89
90
// set the selectionMode
91
map.interactivity({selectionMode: "drill-down"});
92
93
// draw the chart
94
map.container("container");
95
map.draw();
96
});