CODEWITHSUNDEEP
graphgoogle-visualization
Gricey
Gricey

Reputation: 1441

Broken axis in Google charts

Is there any way to create a break in my vertical scale on the Google charts api?

I have a couple of dozen data points all about 600-2000 on the y-axis except for one value which is almost 300,000; this makes all the smaller data points nearly unreadable. I need to represent all this data and a logarithmic scale is not an option.

Current Graph

Upvotes: 6

Views: 15542

Answers (2)

Doglas
Doglas

Reputation: 670

You need use a log scale. It's a vAxis and hAxis attribute. The supported values are:

log: Conventional logarithm scale

mirrorLog: Logarithm scale that allows 0 values

var options = {
    vAxis: {
        scaleType: 'mirrorLog',
    }
};

var data = {};//your data

chart.draw(data, options);

Upvotes: -1

jmac
jmac

Reputation: 7128

Simple answer: no, it is not possible.

Breaking axes is (generally) frowned upon in the visualization community and therefore isn't supported most of the time in various software.

If you want to be tricky, you can create a function to find outliers, and then move them to a second series in your data. Plot that series on the second axis, and have it with a different color. This says, "This figure is different and does not fit" which brings added attention to it, while still allowing the rest of the data to be seen in the same scale.

Personally I would just cut off the graph at an arbitrary value, set the value of that point to the maximum value, and add a tooltip saying, "Outlier: 300,000" or whatever it is. This will allow people to see the other numbers, but show that this number itself is an outlier without coloring it differently or removing it from the single series.

Either way is doable.

Upvotes: 8

Related Questions