aboutsummaryrefslogtreecommitdiffstats
path: root/servo/static/js/flot/examples/annotating/index.html
diff options
context:
space:
mode:
authorFilipp Lepalaan <filipp@mac.com>2017-04-24 10:36:10 +0300
committerFilipp Lepalaan <filipp@mac.com>2017-04-24 10:36:10 +0300
commitc1e043b7ba78cee73d13ded9ef03b256202540f1 (patch)
tree2b913aaf4c3c45972cff707afd76d9ad901d40ba /servo/static/js/flot/examples/annotating/index.html
parentef376c2cf80cb89c3c5a5dc79c39c5045406b5e7 (diff)
downloadServo-c1e043b7ba78cee73d13ded9ef03b256202540f1.tar.gz
Servo-c1e043b7ba78cee73d13ded9ef03b256202540f1.tar.bz2
Servo-c1e043b7ba78cee73d13ded9ef03b256202540f1.zip
Move STATIC_ROOT inside app directory
Diffstat (limited to 'servo/static/js/flot/examples/annotating/index.html')
-rwxr-xr-xservo/static/js/flot/examples/annotating/index.html87
1 files changed, 87 insertions, 0 deletions
diff --git a/servo/static/js/flot/examples/annotating/index.html b/servo/static/js/flot/examples/annotating/index.html
new file mode 100755
index 0000000..71f6218
--- /dev/null
+++ b/servo/static/js/flot/examples/annotating/index.html
@@ -0,0 +1,87 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+ <title>Flot Examples: Adding Annotations</title>
+ <link href="../examples.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 type="text/javascript">
+
+ $(function() {
+
+ var d1 = [];
+ for (var i = 0; i < 20; ++i) {
+ d1.push([i, Math.sin(i)]);
+ }
+
+ var data = [{ data: d1, label: "Pressure", color: "#333" }];
+
+ var markings = [
+ { color: "#f6f6f6", yaxis: { from: 1 } },
+ { color: "#f6f6f6", yaxis: { to: -1 } },
+ { color: "#000", lineWidth: 1, xaxis: { from: 2, to: 2 } },
+ { color: "#000", lineWidth: 1, xaxis: { from: 8, to: 8 } }
+ ];
+
+ var placeholder = $("#placeholder");
+
+ var plot = $.plot(placeholder, data, {
+ bars: { show: true, barWidth: 0.5, fill: 0.9 },
+ xaxis: { ticks: [], autoscaleMargin: 0.02 },
+ yaxis: { min: -2, max: 2 },
+ grid: { markings: markings }
+ });
+
+ var o = plot.pointOffset({ x: 2, y: -1.2});
+
+ // Append it to the placeholder that Flot already uses for positioning
+
+ placeholder.append("<div style='position:absolute;left:" + (o.left + 4) + "px;top:" + o.top + "px;color:#666;font-size:smaller'>Warming up</div>");
+
+ o = plot.pointOffset({ x: 8, y: -1.2});
+ placeholder.append("<div style='position:absolute;left:" + (o.left + 4) + "px;top:" + o.top + "px;color:#666;font-size:smaller'>Actual measurements</div>");
+
+ // Draw a little arrow on top of the last label to demonstrate canvas
+ // drawing
+
+ var ctx = plot.getCanvas().getContext("2d");
+ ctx.beginPath();
+ o.left += 4;
+ ctx.moveTo(o.left, o.top);
+ ctx.lineTo(o.left, o.top - 10);
+ ctx.lineTo(o.left + 10, o.top - 5);
+ ctx.lineTo(o.left, o.top);
+ ctx.fillStyle = "#000";
+ ctx.fill();
+
+ // Add the Flot version string to the footer
+
+ $("#footer").prepend("Flot " + $.plot.version + " &ndash; ");
+ });
+
+ </script>
+</head>
+<body>
+
+ <div id="header">
+ <h2>Adding Annotations</h2>
+ </div>
+
+ <div id="content">
+
+ <div class="demo-container">
+ <div id="placeholder" class="demo-placeholder"></div>
+ </div>
+
+ <p>Flot has support for simple background decorations such as lines and rectangles. They can be useful for marking up certain areas. You can easily add any HTML you need with standard DOM manipulation, e.g. for labels. For drawing custom shapes there is also direct access to the canvas.</p>
+
+ </div>
+
+ <div id="footer">
+ Copyright &copy; 2007 - 2013 IOLA and Ole Laursen
+ </div>
+
+</body>
+</html>