summaryrefslogtreecommitdiff
path: root/examples/stacking.html
diff options
context:
space:
mode:
Diffstat (limited to 'examples/stacking.html')
-rw-r--r--examples/stacking.html77
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>