Align gridlines for multiple scales in anychart - anychart

Question

I have an anychart chart with 2 Y-axes with their own scales.
For both scales the gridlines are active.
The number of gridlines for both axes differ (see attached example image).
Is it possible to align the gridlines for both Y-axes?
example image

Answer 1

You should enable grid lines on your chart with yGrid() and tweak the configuration of your vertical scales, especially ticks intervals.
Here is an example:
anychart.onDocumentReady(() => {
let data1 = [
["A", 7],
["B", 3]
];
let data2 = [
["A", 112365],
["B", 99986]
];
let chart = anychart.column(),
series1 = chart.column(data1),
series2 = chart.column(data2);
let yScale = chart.yScale();
yScale.minimum(0);
yScale.ticks().interval(2); // <--- HERE
let extraYScale = anychart.scales.linear();
extraYScale.minimum(0);
extraYScale.ticks().interval(40000); // <--- HERE
let yAxis = chart.yAxis(0);
yAxis.stroke("red");
yAxis.ticks().stroke("red");
yAxis.labels().fontColor("red");
let extraYAxis = chart.yAxis(1);
extraYAxis.scale(extraYScale);
extraYAxis.orientation("right");
extraYAxis.stroke("green");
extraYAxis.ticks().stroke("green");
extraYAxis.labels().fontColor("green");
series1.yScale(yScale);
series2.yScale(extraYScale);
series1.normal().fill("red", 0.5);
series1.normal().stroke("red", 1);
series2.normal().fill("green", 0.5);
series2.normal().stroke("green", 1);
chart.yGrid(true); // <--- HERE
chart.container("container");
chart.draw();
});
#container {
width: 100%;
height: 350px;
}
<script src="https://cdn.anychart.com/releases/8.11.0/js/anychart-core.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.11.0/js/anychart-cartesian.min.js"></script>
<div id="container"></div>