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