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
var data = getData();
3
4
var chart = anychart.resource();
5
chart.zoomLevel(1);
6
chart.data(data);
7
8
var activities = chart.activities();
9
10
// Set hatch fill.
11
activities.hatchFill("forwardDiagonal", "#BDBDBD", 0.6, 10);
12
13
chart.container("container");
14
chart.draw();
15
});
16
function getData() {
17
return [{
18
"name": "Vasil Kiryienka",
19
"description": "Rider",
20
"activities": [
21
{
22
"name": "World Championships",
23
"start": '2016-10-12',
24
"end": '2016-10-12'
25
}
26
]
27
},
28
{
29
"name": "Elia Viviani",
30
"description": "Rider",
31
"activities": [
32
{
33
"name": "Paris - Tours",
34
"start": '2016-10-09',
35
"end": '2016-10-09'
36
},
37
{
38
"name": "World Championships",
39
"start": '2016-10-16',
40
"end": '2016-10-16'
41
},
42
{
43
"name": "Abu Dhabi Tour",
44
"start": '2016-10-20',
45
"end": '2016-10-23'
46
}
47
]
48
},
49
{
50
"name": "Ben Swift",
51
"description": "Rider",
52
"activities": [
53
{
54
"name": "World Championships",
55
"start": '2016-10-09',
56
"end": '2016-10-09'
57
},
58
{
59
"name": "World Championships",
60
"start": '2016-10-16',
61
"end": '2016-10-16'
62
}
63
]
64
},
65
{
66
"name": "Michal Kwiatkowski",
67
"description": "Rider",
68
"activities": [
69
{
70
"name": "World Championships",
71
"start": '2016-10-09',
72
"end": '2016-10-09'
73
},
74
{
75
"name": "Abu Dhabi Tour",
76
"start": '2016-10-20',
77
"end": '2016-10-23'
78
}
79
]
80
},
81
{
82
"name": "Alex Peters",
83
"description": "Rider",
84
"activities": [
85
{
86
"name": "Japan Cup",
87
"start": '2016-10-23',
88
"end": '2016-10-23'
89
}
90
]
91
},
92
{
93
"name": "Ian Stannard",
94
"description": "Rider",
95
"activities": [
96
{
97
"name": "Paris - Tours",
98
"start": '2016-10-09',
99
"end": '2016-10-09'
100
},
101
{
102
"name": "World Championships",
103
"start": '2016-10-16',
104
"end": '2016-10-16'
105
}
106
]
107
},
108
{
109
"name": "Lars Petter Nordhaug",
110
"description": "Rider",
111
"activities": [
112
{
113
"name": "Paris - Tours",
114
"start": '2016-10-09',
115
"end": '2016-10-09'
116
},
117
{
118
"name": "Japan Cup",
119
"start": '2016-10-23',
120
"end": '2016-10-23'
121
}
122
]
123
},
124
{
125
"name": "Nicolas Roche",
126
"description": "Rider",
127
"activities": [
128
{
129
"name": "World Championships",
130
"start": '2016-10-09',
131
"end": '2016-10-09'
132
},
133
{
134
"name": "World Championships",
135
"start": '2016-10-12',
136
"end": '2016-10-12'
137
},
138
{
139
"name": "Abu Dhabi Tour",
140
"start": '2016-10-20',
141
"end": '2016-10-23'
142
}
143
]
144
},
145
{
146
"name": "Geraint Thomas",
147
"description": "Rider",
148
"activities": [
149
{
150
"name": "World Championships",
151
"start": '2016-10-09',
152
"end": '2016-10-09'
153
},
154
{
155
"name": "World Championships",
156
"start": '2016-10-16',
157
"end": '2016-10-16'
158
}
159
]
160
},
161
{
162
"name": "Danny van Poppel",
163
"description": "Rider",
164
"activities": [
165
{
166
"name": "World Championships",
167
"start": '2016-10-09',
168
"end": '2016-10-09'
169
},
170
{
171
"name": "World Championships",
172
"start": '2016-10-16',
173
"end": '2016-10-16'
174
},
175
{
176
"name": "Abu Dhabi Tour",
177
"start": '2016-10-20',
178
"end": '2016-10-23'
179
}
180
]
181
},
182
{
183
"name": "David Lopez",
184
"description": "Rider",
185
"activities": [
186
{
187
"name": "Japan Cup",
188
"start": '2016-10-23',
189
"end": '2016-10-23'
190
}
191
]
192
},
193
{
194
"name": "Xabier Zandio",
195
"description": "Rider",
196
"activities": [
197
{
198
"name": "Japan Cup",
199
"start": '2016-10-23',
200
"end": '2016-10-23'
201
}
202
]
203
}
204
]
205
}