diff options
Diffstat (limited to 'static/js/flot/examples/interacting/index.html')
-rwxr-xr-x | static/js/flot/examples/interacting/index.html | 130 |
1 files changed, 0 insertions, 130 deletions
diff --git a/static/js/flot/examples/interacting/index.html b/static/js/flot/examples/interacting/index.html deleted file mode 100755 index 19136df..0000000 --- a/static/js/flot/examples/interacting/index.html +++ /dev/null @@ -1,130 +0,0 @@ -<!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: Interactivity</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 sin = [], - cos = []; - - for (var i = 0; i < 14; i += 0.5) { - sin.push([i, Math.sin(i)]); - cos.push([i, Math.cos(i)]); - } - - var plot = $.plot("#placeholder", [ - { data: sin, label: "sin(x)"}, - { data: cos, label: "cos(x)"} - ], { - series: { - lines: { - show: true - }, - points: { - show: true - } - }, - grid: { - hoverable: true, - clickable: true - }, - yaxis: { - min: -1.2, - max: 1.2 - } - }); - - function showTooltip(x, y, contents) { - $("<div id='tooltip'>" + contents + "</div>").css({ - position: "absolute", - display: "none", - top: y + 5, - left: x + 5, - border: "1px solid #fdd", - padding: "2px", - "background-color": "#fee", - opacity: 0.80 - }).appendTo("body").fadeIn(200); - } - - var previousPoint = null; - $("#placeholder").bind("plothover", function (event, pos, item) { - - if ($("#enablePosition:checked").length > 0) { - var str = "(" + pos.x.toFixed(2) + ", " + pos.y.toFixed(2) + ")"; - $("#hoverdata").text(str); - } - - if ($("#enableTooltip:checked").length > 0) { - if (item) { - if (previousPoint != item.dataIndex) { - - previousPoint = item.dataIndex; - - $("#tooltip").remove(); - var x = item.datapoint[0].toFixed(2), - y = item.datapoint[1].toFixed(2); - - showTooltip(item.pageX, item.pageY, - item.series.label + " of " + x + " = " + y); - } - } else { - $("#tooltip").remove(); - previousPoint = null; - } - } - }); - - $("#placeholder").bind("plotclick", function (event, pos, item) { - if (item) { - $("#clickdata").text(" - click point " + item.dataIndex + " in " + item.series.label); - plot.highlight(item.series, item.datapoint); - } - }); - - // Add the Flot version string to the footer - - $("#footer").prepend("Flot " + $.plot.version + " – "); - }); - - </script> -</head> -<body> - - <div id="header"> - <h2>Interactivity</h2> - </div> - - <div id="content"> - - <div class="demo-container"> - <div id="placeholder" class="demo-placeholder"></div> - </div> - - <p>One of the goals of Flot is to support user interactions. Try pointing and clicking on the points.</p> - - <p> - <label><input id="enablePosition" type="checkbox"></input>Show mouse position</label> - <span id="hoverdata"></span> - <span id="clickdata"></span> - </p> - - <p>A tooltip is easy to build with a bit of jQuery code and the data returned from the plot.</p> - - <p><label><input id="enableTooltip" type="checkbox"></input>Enable tooltip</label></p> - - </div> - - <div id="footer"> - Copyright © 2007 - 2013 IOLA and Ole Laursen - </div> - -</body> -</html> |