Skip to content

Latest commit

 

History

History
182 lines (117 loc) · 5.99 KB

README.md

File metadata and controls

182 lines (117 loc) · 5.99 KB
Raw

Notice: The architecture of this library is still evolving, so expect (many) backwards-incompatible changes

WebPPL visualization library. Demo: probmods.github.io/webppl-viz/.

Dependencies:

Installation:

cd ~                             # or however you get to the home directory
mkdir .webppl                    # make a folder called .webppl (if it doesn't already exist)
cd .webppl
npm install probmods/webppl-viz  # install this node package

Usage:

  • Command-line: require as a WebPPL package. Example: webppl foo.wppl --require webppl-viz
  • Browser: build (run grunt bundle) and then include webppl-viz.js and webppl-viz.css on your web page. (You can also bundle this with core webppl when building that for the browser.)

Plotting data

Methods for plotting raw data.

Bar plot

viz.bar(df, [options])

viz.bar(xs, ys, [options])

Options:

  • horizontal (default: false). (TODO) draw a horizontal plot rather than vertical one.
  • xLabel (default: x). x axis label.
  • yLabel (default: y). y axis label.
  • xType (default: nominal). type of x axis (nominal or quantitative).
  • groupBy (default: none). Grouping variable for different bars.

Line plot

viz.line(df, [options])

viz.line(xs, ys, [options])

Options:

  • xLabel (default: x). x axis label.
  • yLabel (default: y). y axis label.
  • groupBy (default: none). Grouping variable for different lines.
  • xBounds (default: min and max of the supplied data). An array of [min,max] bounds for the x-axis.
  • yBounds (default: min and max of the supplied data). An array of [min,max] bounds for the y-axis.
  • strokeWidth (default: 2). The line stroke width, in pixels.

Scatter plot

viz.scatter(xs, ys, [options])

viz.scatter(df, [options])

Options:

  • xLabel (default: x). x axis label.
  • yLabel (default: y). y axis label.

Plotting distributions (basic)

Basic methods for visualizing samples and marginal distributions. These plot data that are up to 2-dimensional.

Table

viz.table(dist, [options])

viz.table(samples, [options])

Options:

  • destructure (default = true). Expand support keys as columns of the table.
  • log (default = false). If true, shows log probabilities.
  • top (default = false). If a number n, only shows top n results.
  • fileName (default = None). If provided, prints the table into that file in HTML format.

Histogram

viz.hist(samples, [options])

viz.hist(dist, [options])

Options:

  • numBins (defaults to 30). For real-valued data, how many bins to aggregate data into.

Density plot

viz.density(samples, [options])

viz.density(dist, [options])

Options:

  • bounds (default: min and max of the supplied samples). An array of bounds for density estimation

Heat map

viz.heatMap(samples, [options])

viz.heatMap(dist, [options])

Options:

  • bandwidthX (TODO)
  • bandwidthY (TODO)
  • boundsX (TODO)
  • boundsY (TODO)

Parallel coordinates

TODO: document this

Plotting distributions (complex)

More complex methods for visualizing smaples and distributions. These can plot data that are higher dimensional.

Marginals

viz.marginals(dist) shows each component of a joint distribution dist -- density plots for real components and histograms for categorical components.

Automatic visualization

viz.auto tries to automatically construct a useful visualization based on the types of the different components in the posterior.

Options:

  • summarize (default = false). (TODO) For data with real-valued components, you can either try to show all the data (scatter plot) or summarize by showing a density estimate (heat map). This option has no effect if data is entirely categorical.

How it works

viz.auto uses the types of the components to constrain visualization. Let's use c to denote categorical variables and r for real variables (for now, ordinal variables are treated as categorical). Some examples of types:

Support element Type Notes
String c
Integer r
Real number r
Object concatenation of component types The type of {fruit: 'apple', price: 3.6} is rc
Array concatenation of component types The type of [9.2, 8.1, 'candy bar'] is rrc

How each type is visualized:

Type Visualization
c histogram
r density plot
cc bar plot (but if both dimensions have size >5, then heat map)
cr density curve, colors for different categorical groups
rr scatter plot (TODO
ccc trellis frequency table
ccr trellis density plot, colors for different categorical groups
crr trellis scatter plot (TODO
rrr+ parallel coordinates plot
cccc trellis frequency table (TODO)
cccr trellis scatter plot (TODO
ccrr trellis scatter plot / heat map (TODO)
crrr trellis parallel coordinates plot (TODO)
ccrrr trellis parallel coordinates plot (TODO)

Development notes

grunt setup-demo       # make webppl and webppl-editor dependencies for demo
grunt bundle           # compile js + minify, make css
grunt browserify       # compiling js
grunt uglify           # minify js
grunt browserify-watch # watchified compile js
grunt css              # make css