<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="robots" content="noindex">
<title>RGraph: HTML5 charts library</title>
<link rel="stylesheet" href="css/website.css" type="text/css" media="screen" />
<style>
/* Override the background image */
body {
background-color: white;
background-image: none;
padding: 0;
text-align: left;
}
</style>
<link rel="icon" type="image/png" href="images/favicon.png">
<script src="libraries/RGraph.common.core.js" ></script>
<script src="libraries/RGraph.common.dynamic.js" ></script>
<script src="libraries/RGraph.common.key.js" ></script>
<script src="libraries/RGraph.drawing.rect.js" ></script>
<script src="libraries/RGraph.common.effects.js" ></script>
<script src="libraries/RGraph.common.tooltips.js" ></script>
<script src="libraries/RGraph.bar.js" ></script>
<style>
/* Override the main sites padding that allows for the nav bar */
body {
padding-top: 0 !important;
}
</style>
</head>
<body style="margin: 8px !important">
<a href="http://www.rgraph.net" target="_blank">
<img src="images/rgraph.jpg" width="261" height="68" alt="RGraph: Free 2D/3D JavaScript charts" hspace="10" vspace="10" />
</a>
<canvas width="600" height="350" id="cvs_bar" style="float: right"></canvas>
<h2>Demos <span>of charts (local)</span></h2>
<p>
Demos of some of the various charts and features provided by RGraph
</p>
<p align="left">
<a href="demos"><b>Go to the demos (local) »</b></a>
</p>
<h2>Demos <span>of charts (online)</span></h2>
<p>
The same demos as above are also available on rgraph.net. Due to browser security the AJAX demos will not work locally
so you can see these if you go online.
</p>
<p align="left">
<a href="http://www.rgraph.net/demos/"><b>Go to the demos (online) »</b></a>
</p>
<h2>Other <span>pages on rgraph.net</span></h2>
<ul>
<li>
<a href="http://www.rgraph.net" target="_blank">Home page</a><br />
The RGraph homepage on www.rgraph.net<br /><br />
</li>
<li>
<a href="http://www.rgraph.net/examples" target="_blank">Examples</a><br />
Examples of the types of charts that are supported by RGraph.<br /><br />
</li>
<li>
<a href="http://www.rgraph.net/docs" target="_blank">Documentation</a><br />
Documentation for RGraph<br /><br />
</li>
<li>
<a href="http://www.rgraph.net/docs/howto-index.html" target="_blank">HOWTO guides</a><br />
Guides for doing specific tasks with RGraph.<br /><br />
</li>
</ul>
<p>
<a href="https://www.facebook.com/sharer/sharer.php?u=http://www.rgraph.net" target="_blank" onclick="window.open('https://www.facebook.com/sharer/sharer.php?u=http://www.rgraph.net', null, 'top=50,left=50,width=600,height=368'); return false"><img src="images/facebook-large.png" width="200" height="43" alt="Share on Facebook" border="0" title="Visit the RGraph Facebook page" /></a>
<a href="https://twitter.com/_rgraph" target="_blank" onclick="window.open('https://twitter.com/_rgraph', null, 'top=50,left=50,width=700,height=400'); return false"><img src="images/twitter-large.png" width="200" height="43" alt="Share on Twitter" border="0" title="Mention RGraph on Twitter" /></a>
</p>
<p style="font-size: 70%">
© Copyright 2015 RGraph Licensing All rights reserved.
</p>
<script>
window.onload = function ()
{
var bar = new RGraph.Bar('cvs_bar', [[45,-60],[-65,-30],[40,80],[-59,48]])
.set('colors', [
'rgba(255, 176, 176, 1)',
'rgba(153, 208, 249,1)'
])
.set('labels', ['Luis', 'Kevin', 'John', 'Gregory'])
.set('tooltips', ['Luis','Luis','Kevin','Kevin','John','John','Gregory','Gregory'])
.set('tooltips.event', 'onmousemove')
.set('ymax', 100)
.set('ylabels.count', 4)
.set('numyticks', 8)
.set('strokestyle', 'rgba(0,0,0,0)')
.set('hmargin.grouped', 2)
.set('units.pre', '�')
.set('title', 'Bar chart with tooltips')
.set('title.y', 25)
.set('gutter.top', 55)
.set('gutter.left', 40)
.set('gutter.right', 15)
.set('gutter.bottom', 80)
.set('xaxispos', 'center')
.set('key', ['Results from Monday','Results from Tuesday'])
.set('key.position', 'gutter')
.set('key.position.y', 30)
.set('variant', '3d')
.set('axis.color', '#aaa')
.draw()
};
</script>
</body>
</html>