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
3
// set the data
4
table = anychart.data.table();
5
table.addData([
6
['2004-01-02', 29, 1217],
7
['2004-01-05', 38, 3885],
8
['2004-01-06', 43, 992],
9
['2004-01-07', 48, 1753],
10
['2004-01-08', 61, 2493],
11
['2004-01-09', 68, 5672],
12
['2004-01-12', 52, 7284],
13
['2004-01-13', 56, 2737],
14
['2004-01-14', 42, 8338],
15
['2004-01-15', 46, 4829],
16
['2004-01-16', 91, 7532],
17
['2004-01-20', 62, 10387],
18
['2004-01-21', 54, 3832],
19
['2004-01-22', 43, 9248],
20
['2004-01-23', 59, 2487],
21
['2004-01-26', 42, 2498],
22
['2004-01-27', 49, 7564],
23
['2004-01-28', 49, 5764],
24
['2004-01-29', 86, 3549],
25
['2004-01-30', 71, 7365],
26
['2004-02-02', 81, 2985],
27
['2004-02-03', 81, 3573],
28
['2004-02-04', 90, 9834],
29
['2004-02-05', 100, 3453]
30
]);
31
32
// map the data
33
mapping_total = table.mapAs();
34
mapping_total.addField('value', 1);
35
mapping_region = table.mapAs();
36
mapping_region.addField('value', 2);
37
38
// chart type
39
var chart = anychart.stock();
40
41
// set the series
42
var series_total = chart.plot(0).stick(mapping_total);
43
series_total.name("Total Request number");
44
var series_region = chart.plot(1).stick(mapping_region);
45
series_region.name("Region Request Number");
46
47
// coloring
48
series_total.stroke("#ff0000");
49
50
// crosshair settings
51
chart.plot(0).dateTimeHighlighter("green", 0.5, "10 4");
52
53
chart.title('Stock Stick Demo');
54
55
chart.container('container');
56
chart.draw();
57
});