diff options
| author | Igor Sfiligoi <isfiligoi@ucsd.edu> | 2013-11-07 12:50:35 -0500 |
|---|---|---|
| committer | Igor Sfiligoi <isfiligoi@ucsd.edu> | 2013-11-07 12:50:35 -0500 |
| commit | 680241cbb652ee29088baa6cde2da02002e5ec47 (patch) | |
| tree | 3f0c17df67c0ab0e91542ae75fff175750581859 /examples/stacking.html | |
| parent | f361d0498d284c6c7f3f366bf88e49b93e1245f0 (diff) | |
Diffstat (limited to 'examples/stacking.html')
| -rw-r--r-- | examples/stacking.html | 77 |
1 files changed, 0 insertions, 77 deletions
diff --git a/examples/stacking.html b/examples/stacking.html deleted file mode 100644 index b7de391..0000000 --- a/examples/stacking.html +++ /dev/null @@ -1,77 +0,0 @@ -<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> -<html> - <head> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> - <title>Flot Examples</title> - <link href="layout.css" rel="stylesheet" type="text/css"> - <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]--> - <script language="javascript" type="text/javascript" src="../jquery.js"></script> - <script language="javascript" type="text/javascript" src="../jquery.flot.js"></script> - <script language="javascript" type="text/javascript" src="../jquery.flot.stack.js"></script> - </head> - <body> - <h1>Flot Examples</h1> - - <div id="placeholder" style="width:600px;height:300px;"></div> - - <p>With the stack plugin, you can have Flot stack the - series. This is useful if you wish to display both a total and the - constituents it is made of. The only requirement is that you provide - the input sorted on x.</p> - - <p class="stackControls"> - <input type="button" value="With stacking"> - <input type="button" value="Without stacking"> - </p> - - <p class="graphControls"> - <input type="button" value="Bars"> - <input type="button" value="Lines"> - <input type="button" value="Lines with steps"> - </p> - -<script id="source"> -$(function () { - var d1 = []; - for (var i = 0; i <= 10; i += 1) - d1.push([i, parseInt(Math.random() * 30)]); - - var d2 = []; - for (var i = 0; i <= 10; i += 1) - d2.push([i, parseInt(Math.random() * 30)]); - - var d3 = []; - for (var i = 0; i <= 10; i += 1) - d3.push([i, parseInt(Math.random() * 30)]); - - var stack = 0, bars = true, lines = false, steps = false; - - function plotWithOptions() { - $.plot($("#placeholder"), [ d1, d2, d3 ], { - series: { - stack: stack, - lines: { show: lines, fill: true, steps: steps }, - bars: { show: bars, barWidth: 0.6 } - } - }); - } - - plotWithOptions(); - - $(".stackControls input").click(function (e) { - e.preventDefault(); - stack = $(this).val() == "With stacking" ? true : null; - plotWithOptions(); - }); - $(".graphControls input").click(function (e) { - e.preventDefault(); - bars = $(this).val().indexOf("Bars") != -1; - lines = $(this).val().indexOf("Lines") != -1; - steps = $(this).val().indexOf("steps") != -1; - plotWithOptions(); - }); -}); -</script> - - </body> -</html> |