DocumentServer/OfficeWeb/sdk/Common/Charts/docs/basic.html
nikolay ivanov a8be6b9e72 init repo
2014-07-05 18:22:49 +00:00

64 lines
2.9 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<!--
/**
* o------------------------------------------------------------------------------o
* | This file is part of the OfficeExcel package - you can learn more at: |
* | |
* | http://www.OfficeExcel.net |
* | |
* | This package is licensed under the OfficeExcel license. For all kinds of business |
* | purposes there is a small one-time licensing fee to pay and for non |
* | commercial purposes it is free to use. You can read the full license here: |
* | |
* | http://www.OfficeExcel.net/LICENSE.txt |
* o------------------------------------------------------------------------------o
*/
-->
<title>A basic example of an OfficeExcel chart</title>
<meta name="keywords" content="OfficeExcel javascript charts html5 canvas basic example" />
<meta name="description" content="A basic example of an OfficeExcel chart for implementation help" />
<meta name="googlebot" content="NOODP">
<!-- 1/3. Include the OfficeExcel libraries -->
<script src="../libraries/OfficeExcel.common.core.js" ></script>
<script src="../libraries/OfficeExcel.bar.js" ></script>
<!--[if lt IE 9]><script src="../excanvas/excanvas.original.js"></script><![endif]-->
</head>
<body>
<h1>A basic example</h1>
<!-- 2/3. This is the canvas that the graph is drawn on -->
<canvas id="myBar" width="1000" height="250">[No canvas support]</canvas>
<!--
3/3. This creates and displays the graph. As it is here, you can call this from the window.onload event,
allowing you to put it in your pages header.
-->
<script>
window.onload = function ()
{
var bar = new OfficeExcel.Bar('myBar', [12,13,16,15,16,19,19,12,23,16,13,24]);
bar.Set('chart.gutter.left', 35);
bar.Set('chart.colors', ['red']);
bar.Set('chart.title', 'A basic chart');
bar.Set('chart.labels', ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']);
bar.Draw();
}
</script>
<p>
This is a very basic example that does little more than display a chart. If you're trying to understand how OfficeExcel
works, this should help as there is very little happening on this page. To see the source code of this
page simply view the source (Right click > View Source).
</p>
</body>
</html>