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 chart = anychart.scatterChart();3
chart.title().text('Sample Scatter Graph');4
5
chart.xScale().minimum(1.5).maximum(5.5).ticks().interval(1);6
chart.yScale().minimum(40).maximum(100).ticks().interval(10);7
8
chart.yAxis().title().text('Waiting time between eruptions (Min)');9
chart.xAxis().title().text('Eruption duration (Min)');10
chart.xAxis().drawFirstLabel(false).drawLastLabel(false);11
12
var marker = chart.marker([13
[4.4, 78],14
[3.9, 74],15
[4, 68],16
[4, 76],17
[3.5, 80],18
[4.1, 84],19
[2.3, 50],20
[4.7, 93],21
[1.7, 55],22
[4.9, 76],23
[1.7, 58],24
[4.6, 74],25
[3.4, 75],26
[4.3, 80],27
[1.7, 56],28
[3.9, 80],29
[3.7, 69],30
[3.1, 57],31
[4, 90],32
[1.8, 42],33
[4.1, 91],34
[1.8, 51],35
[3.2, 79],36
[1.9, 53],37
[4.6, 82],38
[2, 51],39
[4.5, 76],40
[3.9, 82],41
[4.3, 84],42
[2.3, 53],43
[3.8, 86],44
[1.9, 51],45
[4.6, 85],46
[1.8, 45],47
[4.7, 88],48
[1.8, 51],49
[4.6, 80],50
[1.9, 49],51
[3.5, 82],52
[4, 75],53
[3.7, 73],54
[3.7, 67],55
[4.3, 68],56
[3.6, 86],57
[3.8, 72],58
[3.8, 75],59
[3.8, 75],60
[2.5, 66],61
[4.5, 84],62
[4.1, 70],63
[3.7, 79],64
[3.8, 60],65
[3.4, 86],66
[4, 71],67
[2.3, 67],68
[4.4, 81],69
[4.1, 76],70
[4.3, 83],71
[3.3, 76],72
[2, 55],73
[4.3, 73],74
[2.9, 56],75
[4.6, 83],76
[1.9, 57],77
[3.6, 71],78
[3.7, 72],79
[3.7, 77],80
[1.8, 55],81
[4.6, 75],82
[3.5, 73],83
[4, 70],84
[3.7, 83],85
[1.7, 50],86
[4.6, 95],87
[1.7, 51],88
[4, 82],89
[1.8, 54],90
[4.4, 83],91
[1.9, 51],92
[4.6, 80],93
[2.9, 78],94
[3.5, 81],95
[2, 53],96
[4.3, 89],97
[1.8, 44],98
[4.1, 78],99
[1.8, 61],100
[4.7, 73],101
[4.2, 75],102
[3.9, 73],103
[4.3, 76],104
[1.8, 55],105
[4.5, 86],106
[2, 48],107
[4.2, 77],108
[4.4, 73],109
[4.1, 70],110
[4.1, 88],111
[4, 75],112
[4.1, 83],113
[2.7, 61],114
[4.6, 78],115
[1.9, 61],116
[4.5, 81],117
[2, 51],118
[4.8, 80],119
[4.1, 79],120
[4.1, 82],121
[4.2, 80],122
[4.5, 76],123
[1.9, 56],124
[4.7, 82],125
[2, 47],126
[4.7, 76],127
[2.5, 61],128
[4.3, 75],129
[4.4, 72],130
[4.4, 74],131
[4.3, 69],132
[4.6, 78],133
[2.1, 52],134
[4.8, 91],135
[4.1, 66],136
[4, 71],137
[4, 75],138
[4.4, 81],139
[4.1, 77],140
[4.3, 74],141
[4, 70],142
[3.9, 83],143
[3.2, 53],144
[4.5, 82],145
[2.2, 62],146
[4.7, 73],147
[4.6, 84],148
[2.2, 58],149
[4.8, 82],150
[4.3, 77],151
[3.8, 75],152
[4, 77],153
[4.1, 77],154
[1.8, 53],155
[4.4, 75],156
[4, 78],157
[2.2, 51],158
[5.1, 81],159
[1.9, 52],160
[5, 76],161
[4.4, 73],162
[4.5, 84],163
[3.8, 72],164
[4.3, 89],165
[4.4, 75],166
[2.2, 57],167
[4.8, 81],168
[1.9, 49],169
[4.7, 87],170
[1.8, 43],171
[4.8, 94],172
[2, 45],173
[4.4, 81],174
[2.5, 59],175
[4.3, 82],176
[4.4, 80],177
[1.9, 54],178
[4.7, 75],179
[4.3, 73],180
[2.2, 57],181
[4.7, 80],182
[2.3, 51],183
[4.6, 77],184
[3.3, 66],185
[4.2, 77],186
[2.9, 60],187
[4.6, 86],188
[3.3, 62],189
[4.2, 75],190
[2.6, 67],191
[4.6, 69],192
[3.7, 84],193
[1.8, 58],194
[4.7, 90],195
[4.5, 82],196
[4.5, 71],197
[4.8, 80],198
[2, 51],199
[4.8, 80],200
[1.9, 62],201
[4.7, 84],202
[2, 51],203
[5.1, 81],204
[4.3, 83],205
[4.8, 84],206
[3, 72],207
[2.1, 54],208
[4.6, 75],209
[4, 74],210
[2.2, 51],211
[5.1, 91],212
[2.9, 60],213
[4.3, 80],214
[2.1, 54],215
[4.7, 80],216
[4.5, 70],217
[1.7, 60],218
[4.2, 86],219
[4.3, 78],220
[1.7, 51],221
[4.4, 83],222
[4.2, 76],223
[2.2, 51],224
[4.7, 90],225
[4, 71],226
[1.8, 49],227
[4.7, 88],228
[1.8, 52],229
[4.5, 79],230
[2.1, 61],231
[4.2, 81],232
[2.1, 48],233
[5.2, 84],234
[2, 63]235
]).type('triangleup').size(4).hoverSize(7).hoverFill('red');236
marker.tooltip().content().hAlign('start');237
marker.tooltip().contentFormatter(function () {238
return 'Waiting time: ' + this['value'] + ' min.\nDuration: ' + this['x'] + ' min.';239
});240
241
chart.line([242
[1.7, 54.310454158527],243
[1.8, 55.2005091829704],244
[1.9, 56.0905642074139],245
[2, 56.9806192318574],246
[2.1, 57.8706742563008],247
[2.2, 58.7607292807443],248
[2.3, 59.6507843051877],249
[2.5, 61.4308943540747],250
[2.6, 62.3209493785181],251
[2.7, 63.2110044029616],252
[2.9, 64.9911144518485],253
[3, 65.881169476292],254
[3.1, 66.7712245007354],255
[3.2, 67.6612795251789],256
[3.3, 68.5513345496223],257
[3.4, 69.4413895740658],258
[3.5, 70.3314445985093],259
[3.6, 71.2214996229527],260
[3.7, 72.1115546473962],261
[3.8, 73.0016096718396],262
[3.9, 73.8916646962831],263
[4, 74.7817197207266],264
[4.1, 75.67177474517],265
[4.2, 76.5618297696135],266
[4.3, 77.4518847940569],267
[4.4, 78.3419398185004],268
[4.5, 79.2319948429438],269
[4.6, 80.1220498673873],270
[4.7, 81.0121048918308],271
[4.8, 81.9021599162742],272
[4.9, 82.7922149407177],273
[5, 83.6822699651611],274
[5.1, 84.5723249896046],275
[5.2, 85.4623800140481]276
]).markers(null).hoverStroke(function () {277
return this['sourceColor'];278
});279
280
chart.container('container').draw();281
});