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