HTMLcopy
1
<div id="container"></div>
CSScopy
8
1
html,
2
body,
3
#container {
4
width: 100%;
5
height: 100%;
6
margin: 0;
7
padding: 0;
8
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
var data = getData();
3
4
var chart = anychart.sunburst(data, 'as-table');
5
6
// Set interactivity.
7
chart.interactivity({
8
selectionMode: "single-select"
9
});
10
11
chart.title('Chart selection mode "single-select"');
12
chart.container('container');
13
chart.draw();
14
});
15
16
function getData() {
17
return [{
18
name: 'Seasonal activities',
19
id: 'activities',
20
parent: null,
21
value: 1000
22
},
23
{
24
name: 'Winter',
25
parent: 'activities',
26
id: 'winter',
27
value: 250
28
},
29
{
30
name: 'Spring',
31
parent: 'activities',
32
id: 'spring',
33
value: 250
34
},
35
{
36
name: 'Summer',
37
parent: 'activities',
38
id: 'summer',
39
value: 250
40
},
41
{
42
name: 'Autumn',
43
parent: 'activities',
44
id: 'autumn',
45
value: 250
46
},
47
{
48
name: 'Running',
49
parent: 'winter',
50
id: 'run',
51
value: 43
52
},
53
{
54
name: 'Snowboarding',
55
parent: 'winter',
56
id: 'snowboard',
57
value: 50
58
},
59
{
60
name: 'Nordic Skiing',
61
parent: 'winter',
62
id: 'nordic',
63
value: 50
64
},
65
{
66
name: 'Working Out',
67
parent: 'winter',
68
id: 'workout',
69
value: 30
70
},
71
{
72
name: 'Ice Skating',
73
parent: 'winter',
74
id: 'iceskate',
75
value: 40
76
},
77
{
78
name: 'Kitesurfing',
79
parent: 'winter',
80
id: 'kitesurf',
81
value: 37
82
},
83
{
84
name: 'Riding',
85
parent: 'spring',
86
id: 'ride',
87
value: 100
88
},
89
{
90
name: 'Crossfit',
91
parent: 'spring',
92
id: 'crossfit',
93
value: 30
94
},
95
{
96
name: 'Hiking',
97
parent: 'spring',
98
id: 'hike',
99
value: 30
100
},
101
{
102
name: 'Yoga',
103
parent: 'spring',
104
id: 'yoga',
105
value: 40
106
},
107
{
108
name: 'Running',
109
parent: 'spring',
110
id: 'run',
111
value: 50
112
},
113
{
114
name: 'Riding',
115
parent: 'summer',
116
id: 'ride',
117
value: 150
118
},
119
{
120
name: 'Windsurfing',
121
parent: 'summer',
122
id: 'windsurf',
123
value: 20
124
},
125
{
126
name: 'Swimming',
127
parent: 'summer',
128
id: 'swim',
129
value: 30
130
},
131
{
132
name: 'Roller Skiing',
133
parent: 'summer',
134
id: 'roller',
135
value: 10
136
},
137
{
138
name: 'Rowing',
139
parent: 'summer',
140
id: 'rowing',
141
value: 40
142
},
143
{
144
name: 'Riding',
145
parent: 'autumn',
146
id: 'ride',
147
value: 90
148
},
149
{
150
name: 'Hiking',
151
parent: 'autumn',
152
id: 'windsurf',
153
value: 20
154
},
155
{
156
name: 'Swimming',
157
parent: 'autumn',
158
id: 'swim',
159
value: 10
160
},
161
{
162
name: 'Nordic Skiing',
163
parent: 'autumn',
164
id: 'nordic',
165
value: 40
166
},
167
{
168
name: 'Climbing',
169
parent: 'autumn',
170
id: 'climbing',
171
value: 40
172
}
173
];
174
}