1 <!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2 <html xmlns=
"http://www.w3.org/1999/xhtml" xml:
lang=
"en" lang=
"en">
4 <title>PlotKit: Quickstart Demo
</title>
5 <meta http-equiv=
"Content-Type" content=
"text/html; charset=UTF-8" />
6 <link href=
"/css/page.css" media=
"screen" rel=
"Stylesheet"
8 <link href=
"tests.css" media=
"screen" rel=
"Stylesheet" type=
"text/css" />
9 <script src=
"/js/mochi/MochiKit.js" type=
"text/javascript"></script>
10 <script src=
"/js/plotkit-svn/excanvas.js" type=
"text/javascript"></script>
11 <script src=
"/js/plotkit-svn/Base.js" type=
"text/javascript"></script>
12 <script src=
"/js/plotkit-svn/Layout.js" type=
"text/javascript"></script>
13 <script src=
"/js/plotkit-svn/Canvas.js" type=
"text/javascript"></script>
14 <script src=
"/js/plotkit-svn/SweetCanvas.js" type=
"text/javascript"></script>
21 <h2>Quickstart Demo
</h2>
23 <div style=
"margin: 0 auto 0 auto; width: 500px;">
24 <div><canvas id=
"chart" width=
"500" height=
"300"></canvas></div>
28 <table id=
"values" class=
"data">
30 <tr><td>x
</td><td>y1
</td><td>y2
</td></tr>
33 <tr><td>0</td><td>0</td><td>3</td></tr>
34 <tr><td>1</td><td>10</td><td>20</td></tr>
35 <tr><td>2</td><td>5</td><td>10</td></tr>
36 <tr><td>3</td><td>6</td><td>7</td></tr>
37 <tr><td>4</td><td>7</td><td>8</td></tr>
38 <tr><td>5</td><td>6</td><td>7</td></tr>
39 <tr><td>6</td><td>7</td><td>8</td></tr>
43 <script type=
"text/javascript">
44 var layout = new Layout(
"line");
45 layout.addDatasetFromTable(
"dataset2", $(
"values"), xcol =
0, ycol =
2);
46 layout.addDatasetFromTable(
"dataset1", $(
"values"), xcol =
0, ycol =
1);
49 var chart = new SweetCanvasRenderer($(
"chart"), layout);
55 <div class=
"footer"><a href=
"http://www.liquidx.net/plotkit/">PlotKit
</a></div>