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
var chart = anychart.line();
4
5
chart.title("Extra Axes Binding Sample");
6
7
// setting yAxis settings
8
chart.yAxis(0).title("Basic Y-Axis");
9
chart.yAxis(1).title("Extra Y-Axis");
10
11
// setting Grid settings
12
chart.xGrid(true);
13
chart.yGrid(true);
14
15
// adding extra Y scale
16
var extraYScale = anychart.scales.linear();
17
extraYScale.minimum(0);
18
extraYScale.maximum(100);
19
extraYScale.ticks().interval(10);
20
extraYScale.minorTicks().interval(2);
21
22
// adding and adjust extra Y axis
23
var extraYAxis = chart.yAxis(1);
24
extraYAxis.orientation("right");
25
extraYAxis.scale(extraYScale);
26
27
// setting first series of data
28
var firstSeries = [
29
["A", 637166],
30
["B", 721630],
31
["C", 148662],
32
["D", 78662],
33
["E", 90000]
34
];
35
36
// setting second series of data
37
var secondSeries = [
38
["A", 95],
39
["B", 97],
40
["C", 96],
41
["D", 70],
42
["E", 35]
43
];
44
45
// setting and adjusting data visualisation
46
var columnSeries = chart.column(firstSeries);
47
var lineSeries = chart.line(secondSeries);
48
lineSeries.yScale(extraYScale);
49
50
chart.container("container");
51
chart.draw();
52
});