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 = getData();3
4
var chart = anychart.resource();5
chart.zoomLevel(1);6
chart.data(data);7
8
var timeLine = chart.timeLine();9
10
var timeLineHolidays = timeLine.holidays();11
12
// Set fill color.13
timeLineHolidays.fill({14
src: 'https://static.anychart.com/images/underwater.jpg',15
mode: 'stretch',16
opacity: 0.317
});18
19
chart.title('Set fill as an image');20
chart.container('container');21
chart.draw();22
});23
function getData() {24
return [25
{26
name: 'Vasil Kiryienka',27
description: 'Rider',28
activities: [29
{30
name: 'World Championships',31
start: '2016-10-12',32
end: '2016-10-12'33
}34
]35
},36
{37
name: 'Elia Viviani',38
description: 'Rider',39
activities: [40
{41
name: 'Paris - Tours',42
start: '2016-10-09',43
end: '2016-10-09'44
},45
{46
name: 'World Championships',47
start: '2016-10-16',48
end: '2016-10-16'49
},50
{51
name: 'Abu Dhabi Tour',52
start: '2016-10-20',53
end: '2016-10-23'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
}87
]88
},89
{90
name: 'Alex Peters',91
description: 'Rider',92
activities: [93
{94
name: 'Japan Cup',95
start: '2016-10-23',96
end: '2016-10-23'97
}98
]99
},100
{101
name: 'Ian Stannard',102
description: 'Rider',103
activities: [104
{105
name: 'Paris - Tours',106
start: '2016-10-09',107
end: '2016-10-09'108
},109
{110
name: 'World Championships',111
start: '2016-10-16',112
end: '2016-10-16'113
}114
]115
},116
{117
name: 'Lars Petter Nordhaug',118
description: 'Rider',119
activities: [120
{121
name: 'Paris - Tours',122
start: '2016-10-09',123
end: '2016-10-09'124
},125
{126
name: 'Japan Cup',127
start: '2016-10-23',128
end: '2016-10-23'129
}130
]131
},132
{133
name: 'Nicolas Roche',134
description: 'Rider',135
activities: [136
{137
name: 'World Championships',138
start: '2016-10-09',139
end: '2016-10-09'140
},141
{142
name: 'World Championships',143
start: '2016-10-12',144
end: '2016-10-12'145
},146
{147
name: 'Abu Dhabi Tour',148
start: '2016-10-20',149
end: '2016-10-23'150
}151
]152
},153
{154
name: 'Geraint Thomas',155
description: 'Rider',156
activities: [157
{158
name: 'World Championships',159
start: '2016-10-09',160
end: '2016-10-09'161
},162
{163
name: 'World Championships',164
start: '2016-10-16',165
end: '2016-10-16'166
}167
]168
},169
{170
name: 'Danny van Poppel',171
description: 'Rider',172
activities: [173
{174
name: 'World Championships',175
start: '2016-10-09',176
end: '2016-10-09'177
},178
{179
name: 'World Championships',180
start: '2016-10-16',181
end: '2016-10-16'182
},183
{184
name: 'Abu Dhabi Tour',185
start: '2016-10-20',186
end: '2016-10-23'187
}188
]189
},190
{191
name: 'David Lopez',192
description: 'Rider',193
activities: [194
{195
name: 'Japan Cup',196
start: '2016-10-23',197
end: '2016-10-23'198
}199
]200
},201
{202
name: 'Xabier Zandio',203
description: 'Rider',204
activities: [205
{206
name: 'Japan Cup',207
start: '2016-10-23',208
end: '2016-10-23'209
}210
]211
}212
];213
}