Dave Landry edited this page Jun 5, 2017 · 28 revisions

d3plus is an extension to the D3 library that allows fast and easy creation of data visualizations. Click here to view live examples of all of the various things d3plus can do.

Visualizations

The crux of d3plus is its easy-to-use visualizations. By passing your data and setting a few methods that describe your data, d3plus effortlessly creates interactive visualizations to help your explore your data. You get a lot for free here: nesting, tooltips, timelines, legends, just to name a few. Here are the visualizations currently supported by d3plus:

Tree Map Scatter Plot Stacked Area Line Plot Bar Plot Pie Chart

Example

Example

Example

Example

Example

Example
Network Rings Geo Map Boxplot Bubbles

Example

Example

Example

Example

Example

SVG Text Wrapping

SVG does not natively support wrapping text. Because of this, we created our own solution to break lines of SVG text at appropriate points, while also allowing the text to resize to fit the available space (if desired). Here is an example page showing how to wrap and resize SVG text in both rectangles and circles:

SVG Text Wrapping

Available Methods

Forms

d3plus includes advanced, cross-browser form styling and behavior that helps make normal HTML forms beautiful and reliable. Here are the supported form types:

  • Buttons
  • Dropdown Menus
  • Radio Toggles
  • Auto Detect

Click here to learn more about forms, and to see all of the available methods. Here are some example usages:

Converting Existing HTML Forms Creating Forms from Javascript Using Forms in Visualizations Forms with Nested Data

Utilities

As d3plus is developed, any simple functions that could be used publicly are made available for everyone to use. They are grouped into categories based on the type of data that they manipulate, and here are the categories:

Here are some d3plus.color examples:

Legible Text on
Colored Backgrounds
Legible Text on
White Backgrounds
Lighten Colors
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.