A demo of a logarithmic Bar chart

Summary: When you have a dataset which has wildly different values in it a logarithmic chart like this may be the answer.

[No canvas support]

At first look you may think that this looks like a regular, basic Bar chart. And you'd not be far wrong. The Y axis has six labels instead of five (not including zero) but apart from that what's different?

The scale - that's what. Notice that instead of being a linear progression of (for example) [0, 2, 4, 6, 8, 10] it's a logarithmic scale which has the numbers [0,10,100,1000,10000,100000,1000000].

This can make it easier to show datasets which have one or more data points that are significantly higher than the rest - as is shown here (the first value is 1,000,000 and the second value is 5. The entire dataset is:

[1000000,5,6,4,6,8012,12,7]

Before the chart is created the data is converted to a smaller numbers by using the RGraph.log() API function. It's these smaller numbers which are then plotted on the chart.

For smaller screens the size of the chart shrinks, the CSS float is removed, the size of the text reduces and the X axis labels are changed to be angled.


This goes in the documents header:
<script src="RGraph.common.core.js"></script>
<script src="RGraph.line.js"></script>
Put this where you want the chart to show up:
<canvas id="cvs" width="600" height="250">
    [No canvas support]
</canvas>
This is the code that generates the chart: