set y-axis scale manually in a bar chart using angular-chart.js

Question

I'm creating a bar chart using angular-chart.js(0.9.0). The version of Chart.js being used along is 1.0.2.

In my chart, unfortunately, the range of values is very broad. The highest value being in 90,000s and the lowest values being in 4s or 40s. Due to such a range, the chart is not appearing as I would have wanted it to. For example, in the below chart, the highest value is 42000 and the lowest value is 70.

I'm wondering whether we can set the scales of Y-axis manually in Math.pow values i.e have the y axis scale set as 10, 100, 1000, 10000, 100000 and so on. This way I guess I would be able to cover such a high range data correctly in my chart.

I tried using chart-options and setting the scales manually like below. However, using this the scale became 0, 100, 200, 300 and so on.

            $scope.majorOptions = {
                responsive: false,
                maintainAspectRatio: true,
                scaleOverride: true,
                scaleSteps: 10,
                scaleStepWidth: Math.pow(10,2),
                scaleStartValue: 0
            };  

Is there any other approach by which I can set the y axis scales in powers of 10?

Or is there any other approach that you would suggest I take to capture these high range values in my chart.

Thanks.

Answer 1

Try specifying your yAxes with 'type': 'logarithmic' as per http://www.chartjs.org/docs/latest/axes/cartesian/#tick-configuration