amcharts valueaxis incremental manner scaling - amcharts

Question

I have value range from 1 to 40 000 which I am trying to plot on amcharts serial chart. As chart is auto scaling depend on value range, values which are less than 500 (ex: 10, 50, 100...) are shown as line on x-axis itself. In this case auto scaling is 0-1000-2000-3000...
How to achieve scaling in incremental manner i.e. 0-10-100-1000-10000 ... so that all candles including low value candles also get significant visibility.
or suggest any better approach to get all chart candles visible in chart.
<style>
#chartdiv {
width: 100%;
height: 500px;
}
</style>
<!-- Resources -->
<script src="https://www.amcharts.com/lib/4/core.js">
</script>
<script src="https://www.amcharts.com/lib/4/charts.js">
</script>
<script>
src=
"https://www.amcharts.com/lib/4/themes/animated.js" >
</script>
<!-- Chart code -->
<script>
am4core.ready(function() {
// Themes begin
am4core.useTheme(am4themes_animated);
// Themes end
// Create chart instance
var chart = am4core.create("chartdiv",
am4charts.XYChart3D);
// Adding sample data
chart.data = [{
"country": "USA",
"visits": 39000
}, {
"country": "China",
"visits": 100
}, {
"country": "Japan",
"visits": 35000
}, {
"country": "Germany",
"visits": 50
}, {
"country": "UK",
"visits": 200
}, {
"country": "France",
"visits": 20
}, {
"country": "India",
"visits": 25
}, {
"country": "Spain",
"visits": 711
} ];
// Create axes
let categoryAxis = chart.xAxes.push(new
am4charts.CategoryAxis());
categoryAxis.dataFields.category = "country";
categoryAxis.renderer.labels.template.rotation = 270;
categoryAxis.renderer.labels.template.hideOversized =
false;
categoryAxis.renderer.minGridDistance = 20;
categoryAxis.renderer.labels.template.horizontalCenter =
"right";
categoryAxis.renderer.labels.template.verticalCenter =
"middle";
categoryAxis.tooltip.label.rotation = 270;
categoryAxis.tooltip.label.horizontalCenter = "right";
categoryAxis.tooltip.label.verticalCenter = "middle";
let valueAxis = chart.yAxes.push(new
am4charts.ValueAxis());
valueAxis.title.text = "Countries";
valueAxis.title.fontWeight = "bold";
// Create series
var series = chart.series.push(new
am4charts.ColumnSeries3D());
series.dataFields.valueY = "visits";
series.dataFields.categoryX = "country";
series.name = "Visits";
series.tooltipText = "{categoryX}: [bold]{valueY}[/]";
series.columns.template.fillOpacity = .8;
var columnTemplate = series.columns.template;
columnTemplate.strokeWidth = 2;
columnTemplate.strokeOpacity = 1;
columnTemplate.stroke = am4core.color("#FFFFFF");
columnTemplate.adapter.add("fill", (fill, target) => {
return chart.colors.getIndex(target.dataItem.index);
})
columnTemplate.adapter.add("stroke", (stroke, target) =>
{
return chart.colors.getIndex(target.dataItem.index);
})
chart.cursor = new am4charts.XYCursor();
chart.cursor.lineX.strokeOpacity = 0;
chart.cursor.lineY.strokeOpacity = 0;
}); // end am4core.ready()
</script>
<!-- HTML -->
<div id="chartdiv"></div>

Answer 1

You can achieve this by setting:
valueAxis.logarithmic = true;