Skip to content

Domainers, Formatters, and Numeric Axis

Pre-release
Pre-release
Compare
Choose a tag to compare
@jtlan jtlan released this 24 Jun 21:12
· 7788 commits to master since this release
v.0.18.0
3b4dcb5

Good afternoon,

This release introduces the following:

  • Domainers: Objects that give more control over the autodomaining logic on scales.
  • Formatters: Objects for formatting numbers for display.
  • Numeric Axis: An axis type optimized for displaying numerical data.

In addition, Animators (introduced in v0.17.0) have been added to all Plots.

Domainers

This release introduces the Domainer object.

var xScale = new Plottable.Scale.Linear()
             .setDomainer(new Plottable.Domainer().pad().nice());

This lets you turn on and off common settings for autodomaining, and gives us a place to put more of these options (include 0, etc.).

Also, you can set your own function if you want. Here's the default one:

new Plottable.Domainer((extents: any[][]) => [d3.min(extents, (e) => e[0]), d3.max(extents, (e) => e[1])])

For more info, see domainer.ts.

Formatters

Formatters have been added. These are objects that, given an value, produce a String version of the value suitable for display on an Axis. Currently there are 6 kinds:

  • Fixed: Displays the number with exactly precision decimal places
  • Percentage: Displays the number as a percentage with exactly precision decimal places
  • Currency: Displays the number with a given currency symbol and exactly precision decimal places.
  • General: Displays the number with at most precision decimal places.
  • Identity: String()-ifies the input directly.
  • Custom: Uses a custom formatting function.

More formatters will be coming soon, such as one for displaying large numbers (ex: 50000000 --> "50M").

Formatters can be used with the new Numeric Axis: see below.

Numeric Axis

We are currently in the process of replacing the XAxis and YAxis classes with Axis classes specialized for specific functionality. This process began back in v0.14.0, when Category axes were introduced. Numeric Axis is optimized for the display of numbers. Unlike XAxis or YAxis, Numeric axes can be used in all four orientations (top/bottom/left/right). In addition, the width of a vertical Numeric axis or the height of a horizontal Numeric axis is automatically set during layout; the automatic value can be overridden using the width() and height() calls.

As both Numeric and Category axes now exist, expect XAxis and YAxis to be removed in the next version.

API Breaks

  • scale.padDomain() and scale.nice() no longer exist. To get the same effects, use scale.domainer(new Plottable.Domainer().pad().nice()).

Coming up

Expect XAxis and YAxis to be removed in the next version.

Release Music

Disclosure, White Noise

Assets 3
Loading