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.
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
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.
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.
<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] </canvas>This is the code that generates the chart: