Skip to content

F
flot
Commit 701f2f6e authored by David Schnur's avatar David Schnur
Browse files
Options

Style cleanup and converting spaces to tabs.

parent 04f4ac25
Show whitespace changes
Inline Side-by-side
Showing with 62 additions and 53 deletions
examples/setting-options.html
View file @ 701f2f6e
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Flot Examples</title> <title>Flot Examples</title>
<link href="layout.css" rel="stylesheet" type="text/css"> <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]--> <!--[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.js"></script>
<script language="javascript" type="text/javascript" src="../jquery.flot.js"></script> <script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
</head> </head>
<body> <body>
<h1>Flot Examples</h1> <h1>Flot Examples</h1>
<div id="placeholder" style="width:600px;height:300px"></div> <div id="placeholder" style="width:600px;height:300px"></div>
<p>There are plenty of options you can set to control the precise <p>There are plenty of options you can set to control the precise looks of
looks of your plot. You can control the ticks on the axes, the your plot. You can control the ticks on the axes, the legend, the graph
legend, the graph type, etc. The idea is that Flot goes to great type, etc. The idea is that Flot goes to great lengths to provide sensible
lengths to provide sensible defaults so that you don't have to defaults so that you don't have to customize much for a good result.</p>
customize much for a good result.</p>
<script type="text/javascript"> <script type="text/javascript">
$(function () { $(function () {
var d1 = []; var d1 = [];
for (var i = 0; i < Math.PI * 2; i += 0.25) for ( var i = 0; i < Math.PI * 2; i += 0.25 ) {
d1.push([i, Math.sin(i)]); d1.push([ i, Math.sin( i ) ]);
}
var d2 = []; var d2 = [];
for (var i = 0; i < Math.PI * 2; i += 0.25) for (var i = 0; i < Math.PI * 2; i += 0.25) {
d2.push([i, Math.cos(i)]); d2.push([ i, Math.cos( i ) ]);
}
var d3 = []; var d3 = [];
for (var i = 0; i < Math.PI * 2; i += 0.1) for (var i = 0; i < Math.PI * 2; i += 0.1) {
d3.push([i, Math.tan(i)]); d3.push([ i, Math.tan( i ) ]);
}
$.plot($("#placeholder"), [ $.plot( $("#placeholder"), [
{ label: "sin(x)", data: d1}, { label: "sin(x)", data: d1 },
{ label: "cos(x)", data: d2}, { label: "cos(x)", data: d2 },
{ label: "tan(x)", data: d3} { label: "tan(x)", data: d3 }
], { ], {
series: { series: {
lines: { show: true }, lines: { show: true },
points: { show: true } points: { show: true }
}, },
xaxis: { xaxis: {
ticks: [0, [Math.PI/2, "\u03c0/2"], [Math.PI, "\u03c0"], [Math.PI * 3/2, "3\u03c0/2"], [Math.PI * 2, "2\u03c0"]] ticks: [
0, [ Math.PI/2, "\u03c0/2" ], [ Math.PI, "\u03c0" ],
[ Math.PI * 3/2, "3\u03c0/2" ], [ Math.PI * 2, "2\u03c0" ]
]
}, },
yaxis: { yaxis: {
ticks: 10, ticks: 10,
...@@ -52,11 +60,12 @@ $(function () { ...@@ -52,11 +60,12 @@ $(function () {
tickDecimals: 3 tickDecimals: 3
}, },
grid: { grid: {
backgroundColor: { colors: ["#fff", "#eee"] } backgroundColor: { colors: [ "#fff", "#eee" ] }
} }
}); });
}); });
</script> </script>
</body> </body>
</html> </html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment