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
// create data table on loaded data
4
var dataTable = anychart.data.table();
5
dataTable.addData(getData());
6
7
// map loaded data
8
var mapping = dataTable.mapAs({'value': 1});
9
10
// create stock chart
11
var chart = anychart.stock();
12
13
// add a series
14
chart.plot(0).line(mapping);
15
16
// access labels
17
labels = chart.scroller().xAxis().labels();
18
minorLabels = chart.scroller().xAxis().minorLabels();
19
20
// set major labels text format
21
labels.format(function () {
22
return "'" + anychart.format.dateTime(this.tickValue, "yy");
23
});
24
// set labels color
25
labels.fontColor('#000');
26
27
// set minor labels text format
28
minorLabels.format(function() {
29
return anychart.format.dateTime(this.tickValue, 'MMM, d');
30
});
31
32
// set minor labels font
33
minorLabels.fontColor('#000');
34
minorLabels.fontSize(9);
35
36
// adjust the title
37
chart.title("Format the scroller labels");
38
39
// set container id for the chart
40
chart.container('container');
41
42
// initiate chart drawing
43
chart.draw();
44
});
45
46
function getData(){
47
return [
48
['2003-12-24', 2011.08],
49
['2003-12-25', 2020.78],
50
['2003-12-26', 2044.55],
51
['2003-12-29', 2056.75],
52
['2003-12-30', 2089.60],
53
['2003-12-31', 2083.63],
54
['2004-01-01', 2093.54],
55
['2004-01-02', 2011.08],
56
['2004-01-05', 2020.78],
57
['2004-01-06', 2044.55],
58
['2004-01-07', 2056.75],
59
['2004-01-08', 2089.60],
60
['2004-01-09', 2083.63],
61
['2004-01-12', 2093.54],
62
['2004-01-13', 2113.11],
63
['2004-01-14', 2104.29],
64
['2004-01-15', 2101.86],
65
['2004-01-16', 2126.12],
66
['2004-01-20', 2149.03],
67
['2004-01-21', 2139.33],
68
['2004-01-22', 2146.32],
69
['2004-01-23', 2124.76],
70
['2004-01-26', 2120.56],
71
['2004-01-27', 2148.05],
72
['2004-01-28', 2125.02],
73
['2004-01-29', 2085.54],
74
['2004-01-30', 2068.36]
75
];
76
}