mirror of
https://github.com/salesagility/SuiteCRM.git
synced 2024-11-22 07:52:36 +00:00
165 lines
5.2 KiB
HTML
165 lines
5.2 KiB
HTML
<!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', '<27>')
|
||
.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> |