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
// data
4
var data = anychart.data.set([
5
[2000, 10000, 12000, 18000, 11000, 9000, "#64b5f6 0.7"],
6
[2001, 12000, 15000, 16000, 13000, 19000, "#1976d2 0.7"]
7
]);
8
9
// chart type
10
var chart = anychart.column();
11
12
// set the lowest line marker
13
var minMarker = chart.lineMarker(0);
14
// set marker's axis
15
minMarker.axis(chart.yAxis());
16
minMarker.value(9000);
17
minMarker.stroke("#0D0");
18
19
// set the highest line marker
20
var maxMarker = chart.lineMarker(1);
21
// set marker's scale
22
maxMarker.axis(chart.yAxis());
23
maxMarker.value(19000);
24
maxMarker.stroke("red");
25
26
// set y scale ticks interval
27
var yScale = chart.yScale();
28
yScale.minimum(0);
29
30
// y axis title
31
var yAxis = chart.yAxis();
32
yAxis.title("Sales");
33
34
for (var seriesNumber = 1; seriesNumber<6;seriesNumber++){
35
seriesFormatter(seriesNumber);
36
}
37
38
function seriesFormatter(seriesNumber){
39
// map data for series
40
var seriesData = data.mapAs({x: 0, value: [seriesNumber], fill: 6});
41
var series = chart.column(seriesData);
42
series.stroke(null);
43
var tooltip = series.tooltip();
44
tooltip.title(false);
45
tooltip.separator(false);
46
}
47
48
// draw
49
chart.container("container");
50
chart.draw();
51
});