Basic Usage

SigPlot is fairly simple to instantiate and use. First, create a placeholder for the plot:

			    
<div id="plot"></div>
			    
			

Then ensure that it has a non-zero size by using CSS:

			    
#plot { height: 400px; width: 600px; }
			    
			

Instantiate the plot:

			    
plot = new sigplot.Plot(document.getElementById('plot'), {});
			    
			

Then add layers:

			    
plot.overlay_array(data);
			    
			

SigPlot also directly supports the specialized BLUEFILE format:

			    
plot.overlay_href('../dat/sin.tmp');
			    
			

By default, raster plots do not smooth so that each individual data element can be clearly seen. This is typically done when you want to clearly see individual FFTbins. If you prefer smoothing you can change the rasterSmoothing setting.

			    
plot.change_settings({rasterSmoothing: true});
			    
			

Asyncronous overlay_href

The overlay_href method is asyncronous, because the underlying HTTP request is handle asyncronously. If you want to take an action when the layer has been downloaded, use the onload callback.

			    
plot.overlay_href('../dat/sin.tmp', function(hdr, layer_n) {
  console.log("Finished overlay")
});
			    
			

If you make two overlay_href calls, the order of the layers will be arbitrary.

			    
plot.overlay_href('../dat/sin.tmp');
plot.overlay_href('../dat/square.tmp'); // If square.tmp downloads first, if will be the first layer
			    
			

You can avoid this with the following pattern:

			    
		// Use Immediately invoked function to create a closure
		// so we can load files remotely, but keep the order
		(function(p, files) {
			var do_next_overlay = function() {
				var f = files.shift();
				if (f) {
					p.overlay_href(f, do_next_overlay);
				} else {
                                        // We are done loading layers
					p.rescale();
			        }
			}
			do_next_overlay(); // Kick things off
		})(plot, ["../dat/pulse.tmp", "../dat/sin.tmp"]);
			    
			

Mouse Actions

Zoom

To zoom, press and drag the left mouse (LM) over the region of interest and release.

Unzoom

To unzoom, press the (RM).

Select

To zoom, press and drag the left mouse (LM) while holding CTRL over the region of interest and release.

Menu

Press the middle mouse (MM) button to bring up the menu.

Mousewheel Orientation

SigPlot defaults to an wheel scroll orientation, where scrolling the wheel forward will pan down while rolling backwards will pan up. You can change this setting if desired.

			    
plot.change_settings({wheelscroll_mode_natural: false});
			    
			

Keyboard Actions

?

Display help

A

Toggle display x,y readouts: (absc) -> (index) -> (1/absc) -> (time).

B

Toggle Left Mouse Drag Mode: (box) -> (horizontal) -> (vertical).

C

Toggle controls.

L

Toggle legend.

M

Show menu.

R

Toggle display specs (x/y readout).

S

Toggle display specs and axes.

T

Popup box with timecode value at mouse.

X

Popup box with X value at mouse.

Y

Popup box with Y value at mouse.

F

Toggle fullscreen for plot.

CTRL-I

Invert colors