HTMLcopy
1
<button onclick="saveAsSvg();">Save image</button>
2
<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
var chart;
2
anychart.onDocumentReady(function () {
3
var data = getData();
4
5
chart = anychart.resource();
6
chart.data(data).zoomLevel(1);
7
chart.title('Save chart as SVG file with paper size and landscape orientation set');
8
chart.container('container');
9
chart.draw();
10
});
11
12
function saveAsSvg() {
13
14
// Save chart as SVG file
15
chart.saveAsSvg('a5', true);
16
}
17
18
function getData() {
19
return [
20
{
21
name: 'Vasil Kiryienka',
22
description: 'Rider',
23
activities: [
24
{
25
name: 'World Championships',
26
start: '2016-10-12',
27
end: '2016-10-12'
28
}
29
]
30
},
31
{
32
name: 'Elia Viviani',
33
description: 'Rider',
34
activities: [
35
{
36
name: 'Paris - Tours',
37
start: '2016-10-09',
38
end: '2016-10-09',
39
fill: ['#1A237E', '#FFFFFF', '#D50000']
40
},
41
{
42
name: 'World Championships',
43
start: '2016-10-16',
44
end: '2016-10-16'
45
},
46
{
47
name: 'Abu Dhabi Tour',
48
start: '2016-10-20',
49
end: '2016-10-23',
50
fill: '#FFA000'
51
}
52
]
53
},
54
{
55
name: 'Ben Swift',
56
description: 'Rider',
57
activities: [
58
{
59
name: 'World Championships',
60
start: '2016-10-09',
61
end: '2016-10-09'
62
},
63
{
64
name: 'World Championships',
65
start: '2016-10-16',
66
end: '2016-10-16'
67
}
68
]
69
},
70
{
71
name: 'Michal Kwiatkowski',
72
description: 'Rider',
73
activities: [
74
{
75
name: 'World Championships',
76
start: '2016-10-09',
77
end: '2016-10-09'
78
},
79
{
80
name: 'Abu Dhabi Tour',
81
start: '2016-10-20',
82
end: '2016-10-23',
83
fill: '#FFA000'
84
}
85
]
86
},
87
{
88
name: 'Alex Peters',
89
description: 'Rider',
90
activities: [
91
{
92
name: 'Japan Cup',
93
start: '2016-10-23',
94
end: '2016-10-23',
95
fill: '#EF9A9A'
96
}
97
]
98
},
99
{
100
name: 'Ian Stannard',
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: '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
fill: ['#1A237E', '#FFFFFF', '#D50000']
125
},
126
{
127
name: 'Japan Cup',
128
start: '2016-10-23',
129
end: '2016-10-23',
130
fill: '#EF9A9A'
131
}
132
]
133
},
134
{
135
name: 'Nicolas Roche',
136
description: 'Rider',
137
activities: [
138
{
139
name: 'World Championships',
140
start: '2016-10-09',
141
end: '2016-10-09'
142
},
143
{
144
name: 'World Championships',
145
start: '2016-10-12',
146
end: '2016-10-12'
147
},
148
{
149
name: 'Abu Dhabi Tour',
150
start: '2016-10-20',
151
end: '2016-10-23',
152
fill: '#FFA000'
153
}
154
]
155
},
156
{
157
name: 'Geraint Thomas',
158
description: 'Rider',
159
activities: [
160
{
161
name: 'World Championships',
162
start: '2016-10-09',
163
end: '2016-10-09'
164
},
165
{
166
name: 'World Championships',
167
start: '2016-10-16',
168
end: '2016-10-16'
169
}
170
]
171
},
172
{
173
name: 'Danny van Poppel',
174
description: 'Rider',
175
activities: [
176
{
177
name: 'World Championships',
178
start: '2016-10-09',
179
end: '2016-10-09'
180
},
181
{
182
name: 'World Championships',
183
start: '2016-10-16',
184
end: '2016-10-16'
185
},
186
{
187
name: 'Abu Dhabi Tour',
188
start: '2016-10-20',
189
end: '2016-10-23',
190
fill: '#FFA000'
191
}
192
]
193
},
194
{
195
name: 'David Lopez',
196
description: 'Rider',
197
activities: [
198
{
199
name: 'Japan Cup',
200
start: '2016-10-23',
201
end: '2016-10-23',
202
fill: '#EF9A9A'
203
}
204
]
205
},
206
{
207
name: 'Xabier Zandio',
208
description: 'Rider',
209
activities: [
210
{
211
name: 'Japan Cup',
212
start: '2016-10-23',
213
end: '2016-10-23',
214
fill: '#EF9A9A'
215
}
216
]
217
}
218
];
219
}