A Horizontal Bar chart showing election results

Summary: An example of a Horizontal Bar chart that's showing the result of the 2016 UK referendum that decided the question of EU membership.

[No canvas support]

Here's a Horizontal Bar chart clearly indicating the 2016 UK referendum results. Let's not dwell on the disastrous nature of the vote though and look at the chart shall we?

It has a high marginInner setting - though the bars are still quite thick due to the height of the chart and the fact that there's only two values that are being represented.

It uses the labelsAbove setting, has tooltips and the number of X axis labels has been increased. The number of vertical background grid lines has been increased to match the number of labels.

The responsive() function reduces the size of the chart, the text that's on the chart, slightly reduces the marginInner and reduces the number of X axis labels that you see. It also removes the CSS float on the canvas tag.

And finally, it's animated using the grow() effect - which is a linear growing effect.

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