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

做~自己de王妃 提交于 2019-12-07 07:18:09

问题


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.


回答1:


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



来源:https://stackoverflow.com/questions/38386726/set-y-axis-scale-manually-in-a-bar-chart-using-angular-chart-js

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!