A Bar chart showing Facebook revenue over the years
This goes in the documents header:
<script src="RGraph.common.core.js"></script>
<script src="RGraph.common.key.js"></script>
<script src="RGraph.bar.js"></script>
Put this where you want the chart to show up:
<div style="padding-left: 35px">
<canvas id="cvs" width="650" height="250">[No canvas support]</canvas>
</div>
This is the code that generates the chart:
<script>
new RGraph.Bar({
id: 'cvs',
data: [[153,-138],[272,-56],[777,229],[1974,606],[3711,1000],[5089,53],[7872,1500],[12466,2940],[17928,3688],[27638,10217],[40653,15934]],
options: {
yaxisScaleMax: 50000,
labelsAbove:true,
labelsAboveBackground: 'rgba(255,255,255,0.75)',
yaxis: false,
backgroundGridVlines:false,
backgroundGridBorder:false,
colors: ['#2876DD','#0F283E'],
title: 'Facebook revenue from 2007 to 2017',
titleSize: 16,
titleBold: true,
xaxisLabels:['2007','2008','2009','2010','2011','2012','2013','2014','2015','2016','2017'],
xaxisLabelsOffsety: 30,
yaxisTitle: 'Millions of US dollars',
yaxisTitleX: 17,
yaxisTitleBold: true,
marginLeft: 75,
key: ['Revenue','Net income'],
keyPositionX:80,
keyPositionY:25,
keyPositionGraphBoxed: false,
keyColorShape: 'circle',
labelsAboveSize: 8,
yaxisScaleSize: 8
}
}).grow();
</script>