Contents

1. Intro
A. Graphs
Add
Remove
Display Options
Graph Options
B. Data
Worksheets
Categories
Adding Data to Graph
Changing Data Color
Edit
Refresh
About
Link to Google

2. Basic Features
A. Grouping
Make Your Own
Two Groups
Four Groups
B. Mean Median Mode
C. Sampling
D. Apply to All

3. Editing and Adding
A. Edit Menu
Formats Allowed
Delete
B. Add Menu
Label or No Label
Using a Link
C. Google
Formatting
Permissions and Publishings
Paste or Link
Adding Via URL

4. Advanced Features
A. Advanced Grouping
Fixed Size
Fixed Interval
Histogram
Boxplot Basic and Advanced
B. Graph Scaling
By Text
Fitting Scales to Data in a Single Graph
Fitting All Graphs to the Same Scale
Apply to All With Scales
C. Drag and Click Editing
D. Resampling
Dot
Line
Histogram
P-Value Graph

SeeIt3 Distributions Tutorial

Tutorial Videos

If you have any questions not covered by the videos and this tutorial, please email Matt.Steinwachs@gmail.com

1. Intro

Note: SeeIt3 is most compatible with Chrome followed by Firefox.

A. Graphs

Add

To add another graph, click the "New Graph" button in the bar at the top of the screen. Up to four graphs will fit on the page without scrolling. If more than 4 graphs are added, they will begin to scroll off of the page.

Remove

To remove a graph, click the "X" button in the top right corner.

Display Options

The "Display Options" button in the top bar will open a menu where the appearance of SeeIt can be altered. The size of dots used in the graphs can be increased or decreased, as well as the size of text. Graphs can be displayed in black and white for compatibility with printers by selecting the "Black" checkbox. Data points can be displayed as solid or as colored rings by selecting the "Solid" checkbox. Additionally, the data points may be hidden entirely so that other visualizations, such as a box-plot or histogram, can be more clearly seen. To hide data points select the "Hide" checkbox. To close the display menu, either click the "Display Options" button a second time, or click the "X" button in the top right of the menu.

Graph Options

The wrench icon at the top left of a graph allows you to specify different visualizations. These will be covered in more details in Section 2 and 4.

B. Data

Of course, a graph is nothing without data. To access data to use in a graph, click the "Datasets" button on the left side of bar at the top of the screen.

Worksheets

Data is divided into worksheets which have been imported from Google Documents or created in SeeIt. Click the worksheet's title in the data menu to expand it and reveal its options and the categories it contains.

Categories

Each Worksheet contains several categories of data which are titled and assigned colors.

Adding Data to Graph

To view a category of data in a graph, simply click and drag a category from the dataset menu to the graph you want to add to. A graph can display up to four categories. To remove a category from a graph, click and drag the category off the side of the screen to remove it completely, or drag it over another graph to move it there.

Changing Data Color

To change the color of a category, click the colored square next to a category's title and select a color from the pop-up color picker.

Edit

The pencil icon under each worksheet's title opens a menu that shows that worksheets data in a tab separated table. This menu will be covered in more detail in Section 3.

Refresh

If you have made changes to the data in a worksheet loaded from Google Documents and want to reload it, click the circular arrow icon below that worksheet's title.

About

A worksheet can include text with a description of data it contains. To view this description click the question mark icon below a worksheet's title. To close the description window, click the question mark button again, or click the "X" button in the top right corner of the description window.

Link to Google

To view a worksheet with Google Documents click the document icon below that worksheet's title.

2. Basic Features

A. Grouping

Make Your Own

To partition the data in a graph into arbitrary groups, first click the wrench icon in a graph to bring up the graph options, then select "Make your own groups" from the list of radio buttons. To create a new partition, click and drag the green square at the top of the leftmost partition line. The number of data points between any two partitions will be displayed as a green number between each pair of partitions. To adjust the position of a partition line, click and drag the square at the top of the line. To delete a partition, click the square at the top of the line so that its color changes to yellow with a green border, then press the delete key on your keyboard.

Two Groups

To divide the data in a graph into two groups with an equal number of points, click the wrench icon to bring up the graph options, then select "two equal from the list of radio buttons. If the data cannot be divided equally into two groups, the left group will contain the greater number of points.

Four Groups

To divide the data in a graph into four groups with an equal number of points, click the wrench icon to bring up the graph options, then select "four equal" from the list of radio buttons. If the data cannot be divided equally into four groups, the rightmost group will contain the greater number of points.

B. Mean, Median, Mode

To display a line marking the mean, median, or mode of the data in a graph, first click the wrench icon to bring up the graph options, then select the "mean", "median","mode" checkboxes to display the corresponding average. To show all averages select the "all" checkbox. To hide all the averages at once, unselect the "all" checkbox. The exact value of a mean, median, or mode can be seen either by hovering over the square at the top of the indicator line. To make an average value remain on the screen without hovering over it, click once on the square at the top of the indicator line. Note: a mode line will only appear if two or more points in a graph share the same value. Several mode lines may be displayed if several values tie for the most occurrences in a graph.

C. Sampling

To enable the sampling engine for a graph, click the wrench icon to bring up the graph options, then select the "Sampling Engine" checkbox. This will cause one or two sampling graphs to appear below the graph you are sampling from. You may specify whether you want to see one or two samples simultaneously from the same graph by selecting the desired number from the drop down menu next to the "Sampling Engine " checkbox. You may specify the size of a sample by entering the desired sample size in the textbox in the lower right corner of a sample graph. Clicking the "Show Points" button in a sampling graph will cause the points included in that sample to be highlighted in blue in the source graph. You may manually specify what points will be included in a sample by first clicking the "Show Points" button and then clicking points in the source graph. Clicking the "Sample" button in the source graph will cause the samples to be recalculated. Holding down the "Sample" button will cause the samples to be continuously recalculated as long as you hold the button. Any visualizations, such as grouping or mean lines, selected in the source graph will be shown in the sample graphs as well.

D. Apply to All

If you want the settings of one graph to be applied to all graphs you've added, click the apply all button. This includes any visualizations, mean, median, mode lines, and scale. See section 4b for details regarding scale and the apply all button.

3. Editing and Adding Worksheets

A. Edit Menu

Formats Allowed

Data is formatted as rows of entries separated by tabs or commas but not both. The top row designates the titles of each category, and any row after the first contains data. The leftmost column contains labels for datapoints. Data is displayed in the edit menu in a way that makes it easy to copy and paste directly into a spreadsheet. Columns may not be properly aligned when viewed in the edit menu.

Delete

To remove an entire worksheet from the data menu, click the delete button at the bottom of the worksheet edit menu, and click yes on the confirmation dialogue that appears.

B. Add Menu

To add a new worksheet, click the "Add a Worksheet" button at the bottom of the data menu. The format for data entered in the form is the same as for editing.

Label or no Label

When creating a new dataset, you can choose to not specify labels for data by unchecking the "First Column is Label" checkbox. If you uncheck this option, the leftmost column will be considered the first category of data. A default label will be assigned to any data entered in this way.

Using a Link

If you have data saved in a Google Documents spreadsheet, and the spreadsheet has been published (covered in the next section) you can add the spreadsheet to SeeIt by opening the add worksheet menu, clicking the "Load worksheet from URL" button, pasting the link to the google spreadsheet in the textbox that appears, and clicking the "Submit" button.

C. Google

Formatting

SeeIt requires data imported from Google Documents spreadsheet to be in a specific format. The left most column contains labels for the data in each row. The top left cell is for the title of the labels. For instance, the top left cell could contain the word "State" indicating that the labels in the leftmost column correspond to different states in the U.S. The top row of the spreadsheet, excluding the leftmost cell, contains the titles of the categories of data. The cells below each category title contain the data in the that category. Finally, to include a description of the data which can be read in SeeIt, place text beginning with "*" in the cell below the last label in the leftmost column.

Permissions and Publishing

For a Google Documents spreadsheet to be imported into SeeIt it must be published to the web. To do this, in the Google spreadsheet click File and then click the "Publish to the Web..." option. In the menu that appears click the "Start Publishing" button. Now the URL for the spreadsheet can be pasted into SeeIt.

Paste or Link

Alternatively, you can copy the contents of a Google spreadsheet and paste it into the textbox in the add worksheet menu.

Adding Via URL

A spreadsheet can be imported into SeeIt automatically as it loads by using a special URL. At the end of the link to SeeIt Distributions (http://centerforbiophotonics.github.com/SeeIt3/distributionsv3.html) add a questions mark followed by the URL of the spreadsheet you want to load. For example: http://centerforbiophotonics.github.com/SeeIt3/distributionsv3.html?https://docs.google.com/spreadsheet/ccc?key=0AuGPdilGXQlBdHRyYlc4c2RFZllZY2J2RXdhUmFOX1E#gid=0

Adding Via URL

A spreadsheet can be imported into SeeIt automatically by using a special URL. At the end of the URL to SeeIt Distributions

http://centerforbiophotonics.github.com/SeeIt3/distributionsv3.html

add a questions mark followed by the URL of the spreadsheet you want to load. For example:
http://centerforbiophotonics.github.com/SeeIt3/distributionsv3.html?https://docs.google.com/spreadsheet/ccc?key=0AuGPdilGXQlBdHRyYlc4c2RFZllZY2J2RXdhUmFOX1E#gid=0

The link above will load SeeIt with two additional worksheets pre-loaded.

You may also provide just the "key=xxxxxxxxxxxxxxxxxxx" portion of the spreadsheets URL.
http://centerforbiophotonics.github.com/SeeIt3/distributionsv3.html?key=0AuGPdilGXQlBdHRyYlc4c2RFZllZY2J2RXdhUmFOX1E

If using only the keys, you may specify multiple spreadsheets by separating each "key=xxxxxxxxxxxxxxxxxxx" with an ampersand "&". http://centerforbiophotonics.github.com/SeeIt3/distributionsv3.html?key=0AuGPdilGXQlBdHRyYlc4c2RFZllZY2J2RXdhUmFOX1E&key=0Al5kfBmMhbwmdGJ2b1A1eWtMdUF4bWJxcnhBQ0Fsb3c

If the questions mark is followed by an exclamation mark "?!" the default spreadsheets will not be included and the spreadsheet you provide will be loaded exclusively. http://centerforbiophotonics.github.com/SeeIt3/distributionsv3.html?!key=0AuGPdilGXQlBdHRyYlc4c2RFZllZY2J2RXdhUmFOX1E&key=0Al5kfBmMhbwmdGJ2b1A1eWtMdUF4bWJxcnhBQ0Fsb3c

4. Advanced Features

The following features can be accessed by clicking the "Advanced Mode" button on the right side of the top toolbar.

A. Advanced Grouping

Fixed Size

To partition the data in a graph into groups with an equal number of points, first click the wrench icon in a graph to bring up the graph options, then select "fixed size" from the list of radio buttons. You can specify the size of each partition by entering a number in the text box next to the "fixed size" radio button. If the data in a graph can not be evenly divided into groups of the specified size, the rightmost partition will contain the remainder.

Fixed Interval

To partition the data in a graph into fixed sized intervals, first click the wrench icon in a graph to bring up the graph options, then select "fixed interval width" from the list of radio buttons. You can specify the size of the intervals by entering a number in the text box next to the "fixed interval width" radio button. The intervals begin at the left side of the graph. For instance, if the interval width is 10 and the graph begins at 48, then partition lines will be placed at 48, 58, 68, etc.

Histogram

To overlay a histogram over fixed interval width partitions, first click the wrench icon in a graph to bring up the graph options, then select "fixed interval width" from the list of radio buttons, then select the "Histogram" checkbox below the "fixed interval width" radio button.

Boxplot Basic and Advanced

To display a box plot over the data in a graph, first click the wrench icon in a graph to bring up the graph options, then select "Boxplot" fro the list of radio buttons. To show an advanced boxplot, which excludes and places marks above outliers, click the "advanced" checkbox next to the "boxplot" radio button. To show a line indicating the standard deviation of the data in a graph, click the "SD" checkbox next to the "boxplot" radio button.

B. Graph Scaling

By Text

To change the scale of a graph, first click the wrench icon in a graph to bring up the graph options. To change the lower bound of a graph enter a number in the "Min" textbox. To change the upper bound of a graph enter a number in the "Max" textbox. If you enter a number in the "Min" textbox that is larger than the number in the "Max" textbox, or visa-versa, the value will revert to the whatever it was previously.

Fitting Scales to Data in a Single Graph

To set the scale of a graph to closely fit the data it contains, first click the wrench icon in a graph to bring up the graph options, then select the "Fit scales individually" checkbox.

Fitting All Graphs to the Same Scale

The default behavior of SeeIt is to scale all graphs identically so that all the data in all graphs fits within the scale. If you have changed the scale of one or more graphs and wish to revert back to the default scaling, click the "Fit Scales" button in the top bar.

Apply to All with Scales

If a graph has the "Fit scale individually" option selected, then pressing the "apply to all" button will cause all graphs to be fitted to their own data. If the "fit scale individually" option is not selected, then the scale of the graph in which you press the "apply to all" button will become the scale of every graph.

C. Drag and Click Editing

To edit the data in a graph interactively, first click the "Edit Mode" button in the top toolbar. If edit mode is enabled the "Edit Mode" button will be shown in red as well as the graph borders. If more than one category of data has been added to a graph, the category that is currently selected will be be surrounded by a red box. If you click within a graph while edit mode is enabled, a new point will be added to the category that is selected. You can change the value of any point by clicking and dragging it within the graph. If you drag a point off the side of a graph it will be deleted. While dragging, either the current value of the point or the word delete will be shown above the cursor.

D. Resampling

If you have been working with data in SeeIt Distributions and you would like to perform resampling with that same data, click the Resampling button which appears as an advanced feature in the top menu bar. If you have two graphs with one data set assigned to each the resampling module will open in a new page with these same datasets preselected.

Now the resampling graph will contain several controls. You may specify the number of iterations, between 100 and 200,000, to be used in the resampling process by entering a number in the "Iterations" textbox. The display mode of the resampling graph can be set to one of three options:

Dot

This is the standard way that distributions are displayed throughout the SeeIt modules.

Line

This mode will show lines on the graph corresponding to the differences in the means of two random samples taken from the data in both sample graphs.

Histogram

This mode will show the distribution of differences in the means of two random samples taking from the data in both sample graphs.

P-Value Graph

This will show the P value obtained by the resampling process at several significant numbers of iterations. This mode allows a use to see how the P value stabilizes as more iterations of the resampling process are computed.

To step through each iteration of the resampling process manually, click the "Step" button. To watch the result of each iteration of the resampling process appear on the graph, click the "Start" button. To reset the graph click the "Reset" button. To run all iterations at once and see the final distribution and P value, click the "All" button. To specify whether to run resampling with replacement, select the "replacement" checkbox.


If you have any questions not covered by the videos and this tutorial, please email Matt.Steinwachs@gmail.com