Specify axis padding values in pixels or percentages instead of data values

[danelkhen]

It seems that y.axis.padding behaviour uses data related units, which are relative to each graph's data.

Is it possible to specify padding values in pixels or percentages? This allows multiple graphs to have a consistent look, even if they show a completely different range of numbers.

Here's an example of two charts, having the same value for padding, but look entirely different (because the padding is data-related)

var chart = c3.generate({
    data: {
        columns: [
            ['sample', 30, 200, 100, 400, 150, 250]
        ]
    },
    axis: {
        y: {
            min: 0,
            padding: {bottom:10}
        }
    }
});
var chart2 = c3.generate({
    data: {
        columns: [
            ['sample', 0.3, 0.4, 0.7, 0.9, 0.15, 0.25]
        ]
    },
    axis: {
        y: {
            min: 0,
            padding: {bottom:10}
        }
    }
});

[masayuki0812]

Hi, I totally agree. I'll fix this. Thanks!

[danelkhen]

Thanks!

[masayuki0812]

Oh, I forgot writing comment.. This commit will be included in next version. And please see the sample I committed too. Thanks!

[danelkhen]

Yeah I figured it out by looking at your git commit, it's working perfectly. :-)

[geofreyflores]

I know this is closed, but seems related. I was wondering if this is available for the x-axis as well, or do I need to open a new ticket?

[typeofweb]

It seems it's not available for x-axis?

[rumitbodiwala]

if chart is small than not show Y axis and on click on that chart become large and show Y axis how to this is possible??