Click on any of the images below to go to a series of examples of the depicted chart type.

UI Components

These components work in tandem with charts to improve their capabilities.

Data Filter Pane

The data filter pane allows data to be included, omitted, reordered and allows the user to quickly sift through items of interest.

Data Filter Pane

Gui Pane

The GUI Pane allows the user to exercise fine grained control over the appearance of a visual.

Gui Pane

Configuration Pane

The Configuration Pane provides a Data Filter and GUI pane in one cohesive interface. It also performs all the necessary wiring so that visuals respond interactively to any changes.

Configuration Pane

C3 Charts

These examples are based upon C3js.

C3 Area Chart C3 Bar Charts C3 Donut Charts C3 Line Charts C3 Pie Charts C3 Scatter Plots

D3 Charts

These examples are based upon D3.js

Bump Chart Chord Diagram Clustered Force Dendrogram Motion Bar Chart Orbital Layout Parallel Coordinates Radar Chart Radial Tree Sankey Diagram Sunburst Treemap Treemap BarChart TopoJSON Map

D3 Plus Charts

These examples are based upon D3 Plus

Ring Network


These examples are based upon ECharts

Line Chart Polar Line Chart Polar Bar Chart Polar Scatter Plot Polar Categorical Scatter Plot Force Network Circular Network Timeline Nested Pie Chart Steam Graph Heat Map

Elegans 3D Charts

These examples are based upon a version of Elegans that I have extended for my own purposes. These examples require WebGL and will not display on iOS devices such as iPhones and iPads.


NVD3 Charts

The NVD3 framework provides a number of useful charts.

BubbleChart StackedAreaChart


These examples are based upon vis.js