Permalink
Browse files

general cleanups, this is all part of the ongoing work leading up to …

…the 'big change'... sometime...
  • Loading branch information...
1 parent 618b1b1 commit 71b9efade9076fea86703c6d386efd2f02b28529 @rfunduk rfunduk committed Oct 28, 2008
Showing with 82 additions and 106 deletions.
  1. +11 −8 examples/big-data.html
  2. +52 −68 examples/graph-types.html
  3. +1 −0 examples/index.html
  4. +0 −2 examples/interacting.html
  5. +18 −28 jquery.flot.js
View
@@ -1,28 +1,31 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+
<html>
- <head>
+ <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"></link>
<!--[if IE]><script language="javascript" type="text/javascript" src="../excanvas.pack.js"></script><![endif]-->
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
- </head>
- <body>
+ </head>
+ <body>
<h1>Flot Examples</h1>
- <p>This isn't the speediest example of flot, but it does show off
- some of the fancier features - and that they work even with lots of data.</p>
-
+ <p>
+ This isn't the speediest example of flot, but it does show off
+ some of the fancier features - and that they work even with lots of data.
+ </p>
+
<div id="miniature" style="float:left;margin-right:10px;margin-top:0px">
<div id="overview" style="width:300px;height:100px"></div>
<div id="overviewLegend" style="margin-left:0px"></div>
</div>
-
+
<div style="float:left">
<div id="placeholder" style="width:400px;height:300px"></div>
</div>
-
+
<p style="float:left;" id="choices">Show:</p>
<script id="source" language="javascript" type="text/javascript">
View
@@ -1,84 +1,68 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+
<html>
- <head>
+ <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"></link>
<!--[if IE]><script language="javascript" type="text/javascript" src="../excanvas.pack.js"></script><![endif]-->
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
- </head>
- <body>
- <h1>Flot Examples</h1>
-
- <div id="placeholder" style="width:600px;height:300px"></div>
-
- <p>Flot supports lines, points, filled areas, bars and any
- combinations of these, in the same plot and even on the same data
- series.</p>
-
-<script id="source" language="javascript" type="text/javascript">
-$(function () {
- var d1 = [];
- for (var i = 0; i < 14; i += 0.5)
- d1.push([i, Math.sin(i)]);
+ <script id="source" language="javascript" type="text/javascript">
+ $(document).ready( function () {
+ var d1 = [];
+ for( var i = 0; i < 14; i += 0.5 ) { d1.push( [ i, Math.sin( i ) ] ); }
- var d2 = [ [8, 5], [0, 3], [10, 13], [5, 8] ];
+ var d2 = [ [8, 5], [0, 3], [10, 13], [5, 8] ];
- var d3 = [];
- for (var i = 0; i < 14; i += 0.5)
- d3.push([i, Math.cos(i)]);
+ var d3 = [];
+ for( var i = 0; i < 14; i += 0.5 ) { d3.push( [ i, Math.cos( i ) ] ); }
- var d4 = [];
- for (var i = 0; i < 14; i += 0.5)
- d4.push([i, Math.sqrt(i * 10)]);
+ var d4 = [];
+ for( var i = 0; i < 14; i += 0.5 ) { d4.push( [ i, Math.sqrt( i * 10 ) ] ); }
- var d5 = [];
- for (var i = 0; i < 14; i += 0.5)
- d5.push([i, Math.sqrt(i)]);
+ var d5 = [];
+ for( var i = 0; i < 14; i += 0.5 ) { d5.push( [ i, Math.sqrt( i ) ] ); }
- var d6 = [];
- for (var i = 0; i < 14; i += 0.5)
- d6.push( { x: i, y: Math.round(Math.sin(i)+5.5), delta: (i%2+6) } );
- d6.push( { x: 14, y: 6, delta: 2 } );
-
- $.plot($("#placeholder"), [
- {
- data: d1,
- lines: { show: true, fill: true }
- },
- {
- data: d2,
- bars: { show: true }
- },
- {
- data: d3,
- points: { show: true }
- },
- {
- data: d4,
- lines: { show: true }
- },
- {
- data: d5,
- lines: { show: false },
- points: { show: true, radius: 7 }
- },
- {
- data: d6,
- deltas: {
- show: true,
- markerWidth: 4,
- color: {
- above: "black",
- below: "transparent",
- equal: "blue"
- }
- }
+ var d6 = [];
+ for( var i = 0; i < 14; i += 0.5 ) {
+ d6.push( { x: i,
+ y: Math.round( Math.sin( i ) + 5.5 ),
+ delta: ( i % 2 + 6 ) } );
}
- ]);
-});
-</script>
+ d6.push( { x: 14, y: 6, delta: 2 } );
+
+ $.plot( $("#placeholder" ),
+ [ { data: d1,
+ lines: { show: true, fill: true } },
+ { data: d2,
+ bars: { show: true } },
+ { data: d3,
+ points: { show: true } },
+ { data: d4,
+ lines: { show: true } },
+ { data: d5,
+ lines: { show: false },
+ points: { show: true, radius: 7 } },
+ { data: d6,
+ deltas: { show: true,
+ markerWidth: 4,
+ color: { above: "black",
+ below: "transparent",
+ equal: "blue" } } } ]
+ );
+ } );
+ </script>
+ </head>
+ <body>
+ <h1>Flot Examples</h1>
+
+ <div id="placeholder" style="width:600px;height:300px"></div>
- </body>
+ <p>
+ Flot supports lines, points, filled areas, bars and any
+ combinations of these, in the same plot and even on the same data
+ series.
+ </p>
+ </body>
</html>
View
@@ -3,6 +3,7 @@
<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"></link>
</head>
<body>
<h1>Flot Examples</h1>
@@ -1,7 +1,5 @@
<!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="interacting_files/layout.css" rel="stylesheet" type="text/css">
View
@@ -292,54 +292,44 @@
if( xaxis.datamax == bottom_sentry ) xaxis.datamax = 1;
if( yaxis.datamax == bottom_sentry ) yaxis.datamax = 1;
}
-// XXX
+
function constructCanvas() {
canvasWidth = target.width();
canvasHeight = target.height();
- target.html(""); // clear target
- target.css("position", "relative"); // for positioning labels and overlay
+ target.html( '' ).css( 'position', 'relative' );
- if (canvasWidth <= 0 || canvasHeight <= 0)
+ if( canvasWidth <= 0 || canvasHeight <= 0 ) {
throw "Invalid dimensions for plot, width = " + canvasWidth + ", height = " + canvasHeight;
+ }
// the canvas
- canvas = $('<canvas width="' + canvasWidth + '" height="' + canvasHeight + '"></canvas>').appendTo(target).get(0);
- if ($.browser.msie) // excanvas hack
- canvas = window.G_vmlCanvasManager.initElement(canvas);
- ctx = canvas.getContext("2d");
+ canvas = $('<canvas width="' + canvasWidth + '" height="' + canvasHeight + '"></canvas>').appendTo( target ).get( 0 );
+ if( $.browser.msie ) { canvas = window.G_vmlCanvasManager.initElement( canvas ); }
+ ctx = canvas.getContext( '2d' );
// overlay canvas for interactive features
- overlay = $('<canvas style="position:absolute;left:0px;top:0px;" width="' + canvasWidth + '" height="' + canvasHeight + '"></canvas>').appendTo(target).get(0);
- if ($.browser.msie) // excanvas hack
- overlay = window.G_vmlCanvasManager.initElement(overlay);
- octx = overlay.getContext("2d");
+ overlay = $('<canvas style="position:absolute;left:0px;top:0px;" width="' + canvasWidth + '" height="' + canvasHeight + '"></canvas>').appendTo( target ).get( 0 );
+ if( $.browser.msie ) { overlay = window.G_vmlCanvasManager.initElement( overlay ); }
+ octx = overlay.getContext( '2d' );
// we include the canvas in the event holder too, because IE 7
// sometimes has trouble with the stacking order
- eventHolder = $([overlay, canvas]);
+ eventHolder = $( [ overlay, canvas ] );
-
// bind events
- if (options.selection.mode != null) {
- eventHolder.mousedown(onMouseDown);
-
- // FIXME: temp. work-around until jQuery bug 1871 is fixed
- eventHolder.each(function () {
- this.onmousemove = onMouseMove;
- });
+ if( options.selection.mode != null ) {
+ eventHolder.mousedown( onMouseDown ).mousemove( onMouseMove );
}
- if (options.grid.hoverable) {
- eventHolder.each(function () {
- this.onmousemove = onMouseMove;
- });
+ if( options.grid.hoverable ) {
+ eventHolder.mousemove( onMouseMove );
}
- if (options.grid.clickable) {
- eventHolder.click(onClick);
+ if( options.grid.clickable ) {
+ eventHolder.click( onClick );
}
}
-
+// XXX
function setupGrid() {
// x axis
setRange(xaxis, options.xaxis);

0 comments on commit 71b9efa

Please sign in to comment.