old_sql 1.12.0 → 1.13.0

data/public/javascripts/old_sql/plotkit-0.9.1/tests/demo.js

@@ -0,0 +1,136 @@
+/* actual tests */
+
+function drawDemo(element, layout, options) {
+    var renderer = new PlotKit.CanvasRenderer(element, layout, options);
+    renderer.render();
+}
+
+function demoWithStyle(style) {
+    // datasets 
+    var dataset = [
+       [0,1],
+       [1,4],
+       [2,16],
+       [3,8],
+       [4,16],
+       [5,4],
+       [6,1]
+    ];
+
+    var dataset_rev = [
+       [6,0],
+       [5,1],
+       [4,4],
+       [3,9],
+       [2,16],
+       [1,25],
+       [0,36]
+    ];
+
+
+    var options = {
+        "IECanvasHTC": "../plotkit/iecanvas.htc",
+        "drawBackground": false,
+        "shouldFill": true,
+        "shouldStroke": true,
+        "drawXAxis": true,
+        "drawYAxis": true,
+        "padding": {left: 40, right: 10, top: 10, bottom: 20},
+        "strokeColor": null,
+        "strokeColorTransform": "asStrokeColor"
+    };
+
+    if (style == "pie") {
+        options["padding"] = {left: 50, right: 50, top: 50, bottom: 50}
+    }
+
+    var layout = new PlotKit.Layout(style, options);
+    layout.addDataset("noname", dataset);
+    layout.evaluate();
+
+    // stroke/fill toggle
+    drawDemo($('test1'),  layout, options);
+    options["shouldFill"] = false;
+    drawDemo($('test2'),  layout, options);
+    options["shouldStroke"] = false;
+    options["shouldFill"] = true;
+    drawDemo($('test3'),  layout, options);
+    
+    // drawing axis
+    options["shouldFill"] = true;
+    options["shouldStroke"] = true;
+    options["drawXAxis"] = false;
+    options["drawYAxis"] = false;
+    drawDemo($('test4'),  layout, options);
+    options["drawXAxis"] = true;
+    drawDemo($('test5'),  layout, options);
+    options["drawYAxis"] = true;
+    options["drawXAxis"] = false;
+    drawDemo($('test6'),  layout, options);    
+
+    // changing background color and axis color
+    options["drawXAxis"] = true;
+    options["colorScheme"] = PlotKit.Base.colorScheme().reverse()
+    drawDemo($('test7'),  layout, options);
+    options["drawBackground"] = true;
+    options["backgroundColor"] = Color.blueColor().lighterColorWithLevel(0.4);
+    drawDemo($('test8'),  layout, options);
+    options["drawBackground"] = false;
+    options["axisLineColor"] = Color.grayColor();
+    options["axisLabelColor"] = Color.grayColor();
+    options["axisLabelFontSize"] = 8;
+    drawDemo($('test9'),  layout, options);    
+
+    // layout customisation
+    options["colorScheme"] = PlotKit.Base.colorScheme();
+    options["axisLineColor"] = Color.blackColor();
+    options["axisLabelColor"] = Color.blackColor();
+    options["axisLabelFontSize"] = 9;
+    options["yNumberOfTicks"] = 3;
+
+    layout.options.yNumberOfTicks = 3;
+    layout.evaluate();
+    drawDemo($('test10'), layout, options);
+
+    layout.options.xNumberOfTicks = 3;
+    layout.evaluate();
+    drawDemo($('test11'), layout, options);
+
+    layout.options.barWidthFillFraction = 0.5;
+    layout.evaluate();
+    drawDemo($('test12'), layout, options);
+       
+
+    // custom labels
+    layout.options.barWidthFillFraction = 0.75;
+    layout.options.yTicks = [{v:10}, {v:20}, {v:30}, {v:40}];
+    layout.evaluate();
+    drawDemo($('test13'), layout, options);
+
+    layout.options.xTicks = [
+            {v:1, label:"one"}, 
+            {v:2, label:"two"}, 
+            {v:3, label:"three"}, 
+            {v:4, label:"four"},
+            {v:5, label:"five"},
+            {v:6, label:"six"}];
+    layout.evaluate();
+    drawDemo($('test14'), layout, options);
+
+    layout.addDataset("reversed", dataset_rev);
+    layout.options.yTicks = null;
+    layout.options.xTicks = null;
+    layout.options.xNumberOfTicks = 10;
+    layout.options.yNumberOfTicks = 5;
+    layout.options.xTicks = null;
+    layout.options.yTicks = null;
+    layout.evaluate();
+    drawDemo($('test15'), layout, options);
+
+}
+
+function demo() {
+    demoWithStyle("pie");
+}
+
+addLoadEvent(demo);

data/public/javascripts/old_sql/plotkit-0.9.1/tests/dynamic.html

@@ -0,0 +1,161 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit : Basic Unit Tests</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/PlotKit_Packed.js" type="text/javascript"></script>
+   <style type="text/css">
+   
+   body {
+       font-family: Lucida Grande, Verdana, Sans;
+       font-size: small;
+   }
+   
+    table#datatable td {
+        padding: 2px;        
+    }
+   
+    table#datatable thead td {
+        border-top: 1px solid #e0e0e0;
+        background-color: #d0d0d0;
+        border-bottom: 1px solid #c0c0c0;
+        padding-left: 10px;
+        padding-right: 10px;
+    }
+   
+    table#datatable tbody input {
+        border: 1px solid #eee;
+        padding: 2px;
+        width: 90px;
+    }
+   
+   </style>
+   
+   <script type="text/javascript">
+   
+   var dataTable = null;
+   var layout = null;
+   var renderer = null;
+   var options = null;
+   
+   function initDynamicTable() {
+       dataTable = $('datatable');
+       options = PlotKit.Base.officeBlue();
+       layout = new Layout("line", options);
+       renderer = new SweetCanvasRenderer($('canvasTest'), layout, options);
+   }
+   
+   function newRow() {
+       var tbody = dataTable.tBodies[0];
+       var blankRow = TR({}, [
+                TD({}, INPUT({"class":"xvalue", "size":"6", "type":"text", "value":"0"})),
+                TD({}, INPUT({"class":"yvalue", "size":"6", "type":"text", "value":"0"}))]);
+        tbody.appendChild(blankRow);
+   }
+   
+   function chartReload() {
+        var chartStyleSelected = document.forms["options"].chartStyle.selectedIndex;
+        var chartStyle = document.forms["options"].chartStyle[chartStyleSelected].value;
+
+        var colorSchemeSelected = document.forms["options"].colorScheme.selectedIndex;
+        var colorScheme = document.forms["options"].colorScheme[colorSchemeSelected].value;
+        // grab values
+        var getValue = function(row) {
+           var xElem = MochiKit.DOM.getElementsByTagAndClassName("input", "xvalue", row)[0];
+           var yElem = MochiKit.DOM.getElementsByTagAndClassName("input", "yvalue", row)[0];
+           var xVal = xElem.value;
+           var yVal = yElem.value;
+   
+           if (xVal.length > 0) {
+               xVal = parseFloat(xVal);
+           }
+           else {
+               xVal = 0;
+           }
+   
+           if (yVal.length > 0) {
+               yVal = parseFloat(yVal);
+           }
+           else {
+               yVal = 0;
+           }
+           return [xVal, yVal];
+        }
+       
+        var values = MochiKit.Base.map(getValue, dataTable.tBodies[0].rows);
+
+        // setup layout options
+        var themeName = "office" + colorScheme;
+        var theme = PlotKit.Base[themeName]();
+        MochiKit.Base.update(options, theme);
+                
+        layout.style = chartStyle;
+        MochiKit.Base.update(layout.options, options);
+        MochiKit.Base.update(renderer.options, options);
+                
+        layout.addDataset("data", values);        
+
+        // update
+        layout.evaluate();
+        renderer.clear();
+        renderer.render();
+       
+   }
+   
+   addLoadEvent(initDynamicTable);
+   
+   </script>
+</head>
+
+<body>
+    <div id="body">
+    <h2>PlotKit Dynamic Test</h2>
+    
+    <div style="padding: 20px;">
+        <form name="options">
+            Chart Style: 
+            <select id="chartStyle" name="chartStyle" onChange="chartReload();">
+                <option value="line">Line Chart</option>
+                <option value="bar">Bar Chart</option>
+                <option value="pie">Pie Chart</option>
+            </select>
+            
+            Colors:
+            <select id="colorScheme" name="colorScheme" onChange="chartReload();">
+                <option value="Blue">Blue</option>
+                <option value="Red">Red</option>
+                <option value="Green">Green</option>
+                <option value="Purple">Purple</option>
+                <option value="Cyan">Cyan</option>
+                <option value="Orange">Orange</option>
+            </select>
+            
+            
+        </form>
+    </div>
+    
+    <div style="float: left; width: 250px;">
+        <table id="datatable" cellspacing="0" cellpadding="0">
+            <thead>
+                <tr><td width="100">X</td><td width="100">Y</td></tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td><input class="xvalue" size="6" type="text" value="0"/></td>
+                    <td><input class="yvalue" size="6" type="text" value="0"/></td>                    
+                </tr>
+            </tbody>
+        </table>
+        <div><a href="#" onclick="newRow(); return false;">add new row</a> <a href="#" onclick="chartReload(); return false;">redraw</a></div>
+    </div>
+    <div style="float: left; width: 400px;">
+        <div><canvas id="canvasTest" width="400" height="400" style="border: 1px solid #eee;"></canvas></div>
+    </div>
+
+    <div style="clear: both;">&nbsp;</div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/labels-img.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit: Image Labels Example</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/PlotKit_Packed.js" type="text/javascript"></script>
+</head>
+
+
+<body>
+    <div id="body">
+    <h2>Image Labels Example.</h2>
+    
+    <div id="example" style="margin: 0 auto 0 auto;" width="400" height="400"></div>
+    
+    <script type="text/javascript">
+        var data = [[0,0], [1,2], [2,3], [3, 7], [4, 8], [5, 6]];
+        var labels = [
+        {v:0, label:IMG({src:"img/konqueror.png", width:16, height:16})},
+        {v:1, label:IMG({src:"img/opera.ico", width:16, height:16})},
+        {v:2, label:IMG({src:"img/msie.gif", width:16, height:16})},
+        {v:3, label:IMG({src:"img/safari.gif", width:16, height:16})},
+        {v:4, label:IMG({src:"img/firefox.png", width:16,height:16})},
+        {v:5, label:IMG({src:"img/mozilla.ico", width:16, height:16})}
+        ];
+        var plotter = EasyPlot("bar", {"xTicks":labels}, $("example"), 
+        [data, "sample.txt"]);
+    </script>
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/labels.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit: X Label Demo</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Base.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Layout.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Canvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/SweetCanvas.js" type="text/javascript"></script>
+   
+</head>
+
+
+<body>
+    <div id="body">
+    <h2>Label Demo</h2>
+
+    <div style="margin: 0 auto 0 auto; width: 500px;">
+    <div><canvas id="chart" width="500" height="300"></canvas></div>
+    
+    <script type="text/javascript">
+        var xTicks = [{label: "13:00", v: 0}, {label: "14:00", v: 1},
+                      {label: "14:00", v: 2}, {label: "15:00", v: 3},
+                      {label: "16:00", v: 4}];
+        var layout = new Layout("line", {"xTicks": xTicks} );
+        layout.addDataset("yay", [[0, 0], [1, 1], [2, 4], [3, 9], [4, 16]]);
+        layout.addDataset("dataset2", [[0, 4], [1, 3], [2, 3], [3, 1], [4, 8]]);        
+        layout.evaluate();
+        
+        var chart = new SweetCanvasRenderer($("chart"), layout);
+        chart.render();
+
+    </script>
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/prototype_compat.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit: SweetCanvasRenderer Test</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+   <script src="http://al.tse.id.au/gallery/lightbox/js/prototype.js" type="text/javascript"></script>
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Base.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Layout.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Canvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/SweetCanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-tests/sweet.js" type="text/javascript"></script>
+</head>
+
+<body>
+    <div id="body">
+    <h2>Sweet Canvas Renderer Tests</h2>
+    
+    <div id="tests">
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/quickstart-easy.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit: Quickstart Demo</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/PlotKit_Packed.js" type="text/javascript"></script>
+</head>
+
+
+<body>
+    <div id="body">
+    <h2>Quickstart EasyPlot Demo</h2>
+    
+    <div id="example" style="margin: 0 auto 0 auto;" width="400" height="400"></div>
+    
+    <script type="text/javascript">
+        var data = [[0,0], [1,2], [2,3], [3, 7], [4, 8], [5, 6]];
+        var plotter = EasyPlot("line", {}, $("example"), [data, "sample.txt"]);
+    </script>
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/quickstart-horiz.html

@@ -0,0 +1,53 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit: Quickstart Demo</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+  
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/PlotKit_Packed.js" type="text/javascript"></script>   
+</head>
+
+
+<body>
+    <div id="body">
+    <h2>Quickstart Demo</h2>
+    
+    <div style="margin: 0 auto 0 auto; width: 500px;">
+    <div><canvas id="chart" width="500" height="300"></canvas></div>
+
+    <br/>
+    
+    <table id="values" class="data">
+        <thead>
+            <tr><td>x</td><td>y1</td><td>y2</td></tr>
+        </thead>
+        <tbody>
+            <tr><td>0</td><td>0</td><td>3</td></tr>
+            <tr><td>1</td><td>10</td><td>20</td></tr>
+            <tr><td>2</td><td>5</td><td>10</td></tr>
+            <tr><td>3</td><td>6</td><td>7</td></tr>
+            <tr><td>4</td><td>7</td><td>8</td></tr>
+            <tr><td>5</td><td>6</td><td>7</td></tr>
+            <tr><td>6</td><td>7</td><td>8</td></tr>            
+        </tbody>
+    </table>
+    
+    <script type="text/javascript">
+        var layout = new Layout("bar", {"barOrientation": "horizontal"});
+        layout.addDatasetFromTable("dataset2", $("values"), xcol = 0, ycol = 2);        
+        layout.addDatasetFromTable("dataset1", $("values"), xcol = 0, ycol = 1);
+        layout.evaluate();
+        
+        var chart = new SweetCanvasRenderer($("chart"), layout);
+        chart.render();
+    </script>
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/quickstart-neg.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit: Quickstart Demo</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/PlotKit_Packed.js" type="text/javascript"></script>
+</head>
+
+
+<body>
+    <div id="body">
+    <h2>Quickstart EasyPlot Demo</h2>
+    
+    <div id="example" style="margin: 0 auto 0 auto;" width="400" height="400"></div>
+    
+    <script type="text/javascript">
+        var data = [[0,0], [1,-2], [2,3], [3, -7], [4, 8], [5, -6]];
+        var plotter = EasyPlot("line", {yOriginIsZero: false}, $("example"), [data]);
+    </script>
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/quickstart-svg.html

@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html
+xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"
+xmlns:svg="http://www.w3.org/2000/svg"
+xmlns:xlink="http://www.w3.org/1999/xlink">
+<head>        
+   <object id="AdobeSVG" width="1" height="1" classid="clsid:78156a80-c6a1-4bbf-8e6a-3cd390eeb4e2"></object>
+   <?import namespace="svg" implementation="#AdobeSVG"?>
+   <title>PlotKit: Quickstart SVG Demo</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/PlotKit_Packed.js" type="text/javascript"></script>
+</head>
+
+<body>
+    <div id="body">
+    <h2>Quickstart SVG Demo</h2>
+    
+    <div style="margin: 0 auto 0 auto; width: 500px;">
+    <div id="svgcontainer" style="width: 500px; height:300px;"></div>
+    <br/>
+    
+    <table id="values" class="data">
+        <thead>
+            <tr><td>x</td><td>y1</td><td>y2</td></tr>
+        </thead>
+        <tbody>
+            <tr><td>0</td><td>0</td><td>3</td></tr>
+            <tr><td>1</td><td>10</td><td>20</td></tr>
+            <tr><td>2</td><td>5</td><td>10</td></tr>
+            <tr><td>3</td><td>6</td><td>7</td></tr>
+            <tr><td>4</td><td>7</td><td>8</td></tr>
+            <tr><td>5</td><td>6</td><td>7</td></tr>
+            <tr><td>6</td><td>7</td><td>8</td></tr>            
+        </tbody>
+    </table>
+    
+    <p><em>Note: With SVG, the most compatible way is NOT to put in SVG tags, but create the SVG element with Javascript. Therefore, instead of adding &lt;svg&gt; tag, we just have a &lt;div&gt; container and create the SVG element using SVGRenderer.SVG().</em></p>
+    
+    <script type="text/javascript">
+        var layout = new Layout("line");
+        layout.addDatasetFromTable("dataset2", $("values"), xcol = 0, ycol = 2);        
+        layout.addDatasetFromTable("dataset1", $("values"), xcol = 0, ycol = 1);
+        layout.evaluate();
+        
+        var svg = SVGRenderer.SVG({"width": 500, "height": 300, "id":"chart"});
+        $('svgcontainer').appendChild(svg);
+        var chart = new SweetSVGRenderer(svg, layout);
+        chart.render();
+    </script>
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>

data/public/javascripts/old_sql/plotkit-0.9.1/tests/quickstart.html

@@ -0,0 +1,57 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+   <title>PlotKit: Quickstart Demo</title>
+   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+   <link href="/css/page.css" media="screen" rel="Stylesheet"
+   type="text/css" />
+   <link href="tests.css" media="screen" rel="Stylesheet" type="text/css" />
+   <script src="/js/mochi/MochiKit.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/excanvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Base.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Layout.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/Canvas.js" type="text/javascript"></script>
+   <script src="/js/plotkit-svn/SweetCanvas.js" type="text/javascript"></script>
+   
+</head>
+
+
+<body>
+    <div id="body">
+    <h2>Quickstart Demo</h2>
+    
+    <div style="margin: 0 auto 0 auto; width: 500px;">
+    <div><canvas id="chart" width="500" height="300"></canvas></div>
+
+    <br/>
+    
+    <table id="values" class="data">
+        <thead>
+            <tr><td>x</td><td>y1</td><td>y2</td></tr>
+        </thead>
+        <tbody>
+            <tr><td>0</td><td>0</td><td>3</td></tr>
+            <tr><td>1</td><td>10</td><td>20</td></tr>
+            <tr><td>2</td><td>5</td><td>10</td></tr>
+            <tr><td>3</td><td>6</td><td>7</td></tr>
+            <tr><td>4</td><td>7</td><td>8</td></tr>
+            <tr><td>5</td><td>6</td><td>7</td></tr>
+            <tr><td>6</td><td>7</td><td>8</td></tr>            
+        </tbody>
+    </table>
+    
+    <script type="text/javascript">
+        var layout = new Layout("line");
+        layout.addDatasetFromTable("dataset2", $("values"), xcol = 0, ycol = 2);        
+        layout.addDatasetFromTable("dataset1", $("values"), xcol = 0, ycol = 1);
+        layout.evaluate();
+        
+        var chart = new SweetCanvasRenderer($("chart"), layout);
+        chart.render();
+
+    </script>
+    </div>
+    
+    <div class="footer"><a href="http://www.liquidx.net/plotkit/">PlotKit</a></div>    
+</div>
+</body></html>