Highchart proportion is wrong when I use yaxis type is "logarithmic"

Question

I'm using highchart in angularjs app. I'm using Highcharts JS v7.2.1 (2019-10-31). When I use "type:'logarithmic'" for yaxis it will render wrong proportion bars. Without that "logarithmic" it will render correctly but I need to display too small value as well. please give me some solution to render chart in correct proportion

 chart = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'column' }, title: { text: 'Negative' }, xAxis: { categories: ['A','B','C','D','E','F','G','H'], title: { text: null } }, yAxis: { type: 'logarithmic', title: { text: null, } }, legend: { enabled: false }, tooltip: { formatter: function() { return this.x + ':' + this.y + ' millions'; } }, plotOptions: { column: { stacking: 'normal', dataLabels: { enabled: true, style: { textShadow: false, 'textOutline': '0px', 'stroke-width': 0, fontSize: '14px' } } }, series: { pointPadding: 0, groupPadding: 0.1, borderWidth: 0, shadow: false, } }, credits: { enabled: false }, series: [{ "name": "Current Pillar Value", "data": [ 15216429, 842869, 773956, 16833254 ], "type": "column", "color": "#0fb2fc", "showInLegend": false }, { "name": "Previous Pillar Value", "data": [ null, 15216429, 16059298, null ], "type": "column", "color": "#d3c9c9", "dataLabels": { "enabled": false }, "showInLegend": false }], });

 <script src="http://code.highcharts.com/highcharts.js"></script> <div id="container" style="height: 300px"></div>

Answer 1

Use yAxis.tickInterval to change interval on your yAxis.

On logarithmic axes, the tickInterval is based on powers, so a tickInterval of 1 means one tick on each of 0.1, 1, 10, 100 etc. A tickInterval of 2 means a tick of 0.1, 10, 1000 etc. A tickInterval of 0.2 puts a tick on 0.1, 0.2, 0.4, 0.6, 0.8, 1, 2, 4, 6, 8, 10, 20, 40 etc.

https://api.highcharts.com/highcharts/yAxis.tickInterval