SOCR Resampling HTML5 Project
Contents
SOCR Project - SOCR HTML5 Resampling, Randomization and Simulation Project
Project goals
The goal of this project is to design a new, modern and portable SOCR web-app that demonstrates the concepts of statistical resampling, randomization and probabilistic simulation, which is purely based on HTML5, CSS3 and JavaScript framework.
Project specification
The general stats-education community needs new web-applications (web-apps) that run in the browser on portable devices and demonstrate graphically and interactively simulation, sampling-resampling and bootstrapping-based statistical inference. This project specification describes some specific examples, applications and use-cases that would aid with the design of a new SOCR web-app that we can test in the classroom. The core functionality, usability and appearance of this new web-app is described below.
The two basic directions for Sampling/Resampling-based Inference are:
- Simulation-Driven: We have several experiments (dies, coins, cards, etc.) generate 1, or many, sample(s). First, we need to replicate 3+ of these simulations in HTML5. Then we can show the sample (user controls the sample size, N), animate resampling from the sample K times (K defaults to 10,000, but generally in the range [10:100,000]), present the bootstrap distribution and show the resampling based inference (e.g., the outcomes may be H/T, Die<3, or 5-card-hand has a pair).
- Data-Driven: User provides their own dataset and postulates a hypothesis. We show the data graphically and animate K (K defaults to 10,000, but generally in the range [10:100,000]) resamples with repetition, then make the bootstrap-based inference, as in the simulation-driven case (1).
Use-Cases/Utilization Protocol
- Identify Data
- User specified Data: Provide a generic SOCR data-spreadsheet where users can past in multicolumn data.
- Data from SOCR Experiments
- TBD
- Map Data to discrete Graphical Objects in a Data-Canvas
- Select a column from the Data-Spreadsheet
- Choose object type (e.g., Coin, Die, Card, etc.)
- TBD
- User Resampling Functionality (User control specs)
- Sampling with or without replacement
- Specify N=original data sample size, K=number of resamples, M=size of each of the samples to be drawn.
- Animate each sample (one drawing observation (M of them) at a time) for each sample (K of them)
- Animate each resample (K resamples in total).
- Typical sizes: N~100, K~10,000, M~100
- User selects hypothesis
- E.g., mean = 25 (also specified by user), variance <12.7, 23th quantile ≥ 17.7, etc.
- Similar interface to the SOCR General CI Applet (select parameter type, e.g., , and parameter null value, e.g., ).
- TBD
- Running the experiment
- Discrete mode or Animated mode
- Step = obtain one sample (of size M)
- Run = obtain all K samples (each of size M)
- Visualize the results (either statically, discrete mode, or dynamically, animation mode)
- Show summary statistics tables
- All samples KxM (columns = contain the random samples within one resampling step, column-size=M; rows = contain the simulations for all resamples, row-size is K)
- Boot-strap-based inference (responding to the user hypothesis) just like we do in the SOCR General CI applet (bootstrap estimation).
See also
The links below provide some interesting examples of Java code for dynamic animations. These may be useful for the new SOCR Resampling/Simulation Experiment when we get to illustrating the random sampling/resampling/drawing of data (or SOCR Experiments objects) and depicting this via animation. Some of these have very clever image warping/Bezier/path function representations which may be applicable for our coins, cards, dice.
Exemplary tools that can be employed
- JSXGraph HTML5/JS Mathematical Functions Charts and graphs
- D3
- See the JavaScript InfoVis Toolkit
- Manual Graphics Paint canvas in HTML5
- RGraph HTML5 Charts and Graphs
- Rendera: Interactive HTML5/CSS3/JS web-page Editor
Translate this page:
