1.0.0 Release Candidate 7

Overview

Why 1.0.0?

There are a number of known issues in the Plottable API that require breaking backwards compatibility to fix. That means there are a number of backwards-incompatible changes in this release. We are working hard to remedy these problems, and get the API in a state that will allow us to maintain backwards compatibility for all releases after v1.0.0.

To provide the best experience to our users, we are rolling out incremental release candidate releases to allow for pre-integration testing. These release candidates are not meant for production, but are meant as testing resources.

Theme of the 1.0.0-rc series

Because of the breaking changes between v0.54.0 and v1.0.0, our goal is that these release candidates will help make the upgrade as smooth as possible for you all, by allowing you to test early, and often.

Please test with these release candidates and make sure you're able to migrate to the new feature set without losing functionality. If you encounter any issues, please file issues here.

A description of the major changes is below. Full instructions on migrating from v0.54.0 to v1.0.0 will be kept updated in our Upgrading to 1.0.0 Guide.

UMD

If a module loader is used to load Plottable, it will no longer export a global variable Plottable. Previously Plottable would be attached to the window whether or not a module loader was used, which was a bug.

API Changes between 1.0.0-rc6 and 1.0.0-rc7

Type renames

• Animators.Plot (interface) -> Animator (interface)

Axes

• Axis.gutter() -> Axis.margin()

• The constructor no longer takes in a Formatter:

  constructor(scale: Scale<D, number>, orientation: string);

  To specify the Formatter, use the formatter() method after construction.

Component

• protected _getSize() --> protected _sizeFromOffer()

• classed() has been split into three methods:

  /**
   * Checks if the Component has a given CSS class.
   *
   * @param {string} cssClass The CSS class to check for.
   */
  hasClass(cssClass: string): boolean;
  /**
   * Adds a given CSS class to the Component.
   *
   * @param {string} cssClass The CSS class to add.
   * @returns {Component} The calling Component.
   */
  addClass(cssClass: string): Component;
  /**
   * Removes a given CSS class from the Component.
   *
   * @param {string} cssClass The CSS class to remove.
   * @returns {Component} The calling Component.
   */
  removeClass(cssClass: string): Component;

  While this is a departure from the D3 signature, separate methods should cut down on confusion and mistakes, particularly the case where a user attempts to set a class using classed(classname) without the boolean.

Legend

• symbolFactoryAccessor() --> symbol()

Utils.DOM

• getBBox() -> elementBBox()
• getElementWidth() -> elementWidth()
• getElementHeight() -> elementHeight()
• getBoundingSVG() -> boundingSVG()
• getUniqueClipPathId() -> generateUniqueClipPathId()
• getSVGPixelWidth() -> REMOVED
• getParsedStyleValue() -> REMOVED
• isSelectionRemovedFromSVG() -> REMOVED
  If you were using the removed methods, please contact us.

Utils.Formatter

• timeIntervalToD3Time moved to Scales.Time.

Utils.Stacking

Utils.Stacked has been renamed to Utils.Stacking.

• StackedDatum type no longer includes the key.

• The new type StackingResult:

  export type StackingResult = Utils.Map<Dataset, Utils.Map<string, StackedDatum>>;

• computeStackOffsets() -> stack() The signature has also changed to:

  stack(datasets: Dataset[], keyAccessor: Accessor<any>, valueAccessor: Accessor<number>): StackingResult

• computeStackExtent() -> stackedExtent(). The signature has also changed to:

  stackedExtent(stackingResult: StackingResult, keyAccessor: Accessor<any>, filter: Accessor<boolean>)

• domainKeys() -> DELETED (privatized)

Utils.Window

• copyObject() removed.

Animators.Easing

• Animators.Base has been renamed to Animators.Easing.
• iterativeDelay() -> stepDelay()
• easing() -> easingMode()
• static fields DEFAULT_START_DELAY_MILLISECONDS, DEFAULT_STEP_DURATION_MILLISECONDS, DEFAULT_ITERATIVE_DELAY_MILLISECONDS, DEFAULT_MAX_TOTAL_DURATION_MILLISECONDS, and DEFAULT_EASING have been removed. The default values can be queried by creating a new Animators.Easing and calling the appropriate getters.

Drawers

• Drawers.Element's logic has been moved up to the base Drawer class.
• Drawers.Area no longer extends Drawers.Line.

Interactions.Drag

• constrainToComponent() --> constrainedToComponent()

Plot

• getAllSelections() --> selections()

XYPlot

• autorange() --> autorangeMode() to more accurately reflect the functionality of this API point.

Plots.Bar

• labelsFormatter() --> labelFormatter() (revert to previous name)

Scales.InterpolatedColor

• colorRange() -> range()

• The constructor no longer takes in the color range, bringing it more in line with the constructor on Scales.Color:

  constructor(scaleType?: string);

  To set the color range, call range() after construction.

RenderController

• setRenderPolicy() --> renderPolicy(), and now also functions as a getter.

1.0.0 Release Candidate 6

Overview

Why 1.0.0?

There are a number of known issues in the Plottable API that require breaking backwards compatibility to fix. That means there are a number of backwards-incompatible changes in this release. We are working hard to remedy these problems, and get the API in a state that will allow us to maintain backwards compatibility for all releases after v1.0.0.

To provide the best experience to our users, we are rolling out incremental release candidate releases to allow for pre-integration testing. These release candidates are not meant for production, but are meant as testing resources.

Theme of the 1.0.0-rc series

Because of the breaking changes between v0.54.0 and v1.0.0, our goal is that these release candidates will help make the upgrade as smooth as possible for you all, by allowing you to test early, and often.

Please test with these release candidates and make sure you're able to migrate to the new feature set without losing functionality. If you encounter any issues, please file issues here.

A description of the major changes is below. Full instructions on migrating from v0.54.0 to v1.0.0 will be kept updated in our Upgrading to 1.0.0 Guide.

d3.d.ts update

DefinitelyTyped has accepted our corrections to the d3.d.ts file, so tsd can again be used to update definitions. It is no longer necessary to use the copy of d3.d.ts from the Plottable repository.

API Changes between 1.0.0-rc5 and 1.0.0-rc6

Generalized Entity

Entity is now generic on the Component type:

export interface Entity<C extends Component> {
  datum: any;
  position: Point;
  selection: d3.Selection<any>;
  component: C;
}

And Plots.PlotEntity extends Entity:

interface PlotEntity extends Entity<Plot> {
  dataset: Dataset;
  index: number;
  component: Plot;
}

Changes:

• dataset moved to PlotEntity, since currently only Plots have Datasets.
• index was intended to work with dataset, and so has also been moved to PlotEntity.

Plot calls that previously returned Entity or Entity[] now return PlotEntity and PlotEntity[].

Legend

• scale() --> colorScale()
• entitiesAt() replaces getEntry() and returns Entity<Legend>[].

Scales.ModifiedLog

• The showIntermediateTicks() endpoint has been removed. To exercise more control over which ticks are displayed, assign a custom TickGenerator to the Scale.

Animators.Rect / Animators.MovingRect

• Animators.Rect and Animators.MovingRect have been removed. Their logic was very specific towards the use case in Plots.Bar, which now uses a properly configured Animators.Base instead. If you are interested in the animation logic used in those animators, please contact us.

SymbolFactories

• The type StringAccessor has been removed, as there are no Plottable API points that use it.

Component

• The _element instance variable has been made private (previously protected). Operating directly on this Selection is an error -- use foreground(), content(), or background() instead, as appropriate.
• The _content instance variable has been made private (previously protected). The content-Selection can still be accessed with content().

Plot

• The _datasetToDrawer instance variable has been made private (previously protected).
• The _attrBindings instance variable has been made private (previously protected). Use attr() to retrive the AccessorScaleBinding instead.
• The _attrExtents instance variable has been made private (previously protected).

Plots.Bar

• The protected static _DEFAULT_WIDTH variable has been removed, since it no longer served a purpose inside Plots.Bar or its subclasses.
• labelFormatter() --> labelsFormatter()

Plots.StackedArea

• The protected method _wholeDatumAttributes() has been removed. Previously this was the list of attributes:

["x", "y", "defined", "d"]

Animators.Base

A number of renames for clarity:

• delay() -> startDelay()
• duration() -> stepDuration()
• maxIterativeDelay -> iterativeDelay()
• maxTotalDuration() now defaults to Infinity. The maximum total duration of animations on Plots remains at the old default of 600ms.
• DEFAULT_DELAY_MILLISECONDS -> DEFAULT_START_DELAY_MILLISECONDS
• DEFAULT_DURATION_MILLISECONDS -> DEFAULT_STEP_DURATION_MILLISECONDS
• DEFAULT_MAX_ITERATIVE_DELAY_MILLISECONDS -> DEFAULT_ITERATIVE_DELAY_MILLISECONDS

Drawers

• added totalTime(), which returns the total time that would be spent drawing (in milliseconds).
• draw() now returns the calling Drawer, instead of the total time that would be spent drawing.

UMD

Plottable now uses the Universal Module Definition API, so it should work with AMD and CommonJS.

1.0.0 Release Candidate 5

Overview

Why 1.0.0?

There are a number of known issues in the Plottable API that require breaking backwards compatibility to fix. That means there are a number of backwards-incompatible changes in this release. We are working hard to remedy these problems, and get the API in a state that will allow us to maintain backwards compatibility for all releases after v1.0.0.

To provide the best experience to our users, we are rolling out incremental release candidate releases to allow for pre-integration testing. These release candidates are not meant for production, but are meant as testing resources.

Theme of the 1.0.0-rc series

Because of the breaking changes between v0.54.0 and v1.0.0, our goal is that these release candidates will help make the upgrade as smooth as possible for you all, by allowing you to test early, and often.

Please test with these release candidates and make sure you're able to migrate to the new feature set without losing functionality. If you encounter any issues, please file issues here.

A description of the major changes is below. Full instructions on migrating from v0.54.0 to v1.0.0 will be kept updated in our Upgrading to 1.0.0 Guide.

API Changes between 1.0.0-rc4 and 1.0.0-rc5

baselineValue() on Plots.Bar()

baselineValue() now operates on X|Y, instead of number:

/**
 * Gets the baseline value.
 * The baseline is the line that the bars are drawn from.
 *
 * @returns {X|Y}
 */
baselineValue(): X | Y;
/**
 * Sets the baseline value.
 * The baseline is the line that the bars are drawn from.
 *
 * @param {X|Y} value
 * @returns {Bar} The calling Bar Plot.
 */
baselineValue(value: X | Y): Bar<X, Y>;

Whether X or Y is appropriate depends on the orientation of the Plots.Bar.

PaddingExceptionsProvider

Now takes a QuantitativeScale, instead of an ordinary Scale:

export interface PaddingExceptionsProvider<D> {
  (scale: QuantitativeScale<D>): D[];
}

Method renames

Plot

animate() --> animated()

animated() now also functions as a getter when invoked with no arguments.

QuantitativeScale

getDefaultTicks() --> defaultTicks()

Animator

getTiming() --> totalTime()

Dispatchers.Mouse

getLastMousePosition() --> lastMousePosition()

Drawer

• _getRenderArea() --> renderArea()
• setup(Selection) -> renderArea(Selection)
• _getSelector() --> selector()
• _getSelection() --> selectionForIndex()

Plottable.Utils refactor

Split utils.ts (Plottable.Utils.Methods) into multiple modules (and adequate files). As a result, the module hierarchy (and sometimes the name of the method itself) has changed:

Utils.Methods.inRange()           -> Utils.Math.inRange();
Utils.Methods.clamp()             -> Utils.Math.clamp();
Utils.Methods.max()               -> Utils.Math.max();
Utils.Methods.min()               -> Utils.Math.min();
Utils.Methods.isNaN()             -> Utils.Math.isNaN();
Utils.Methods.isValidNumber()     -> Utils.Math.isValidNumber();
Utils.Methods.range()             -> Utils.Math.range();
Utils.Methods.distanceSquared()   -> Utils.Math.distanceSquared();

Utils.Methods.addArrays()         -> Utils.Array.add();
Utils.Methods.uniq()              -> Utils.Array.uniq();
Utils.Methods.createFilledArray() -> Utils.Array.createFilledArray();
Utils.Methods.flatten()           -> Utils.Array.flatten();
Utils.Methods.arrayEq()           -> DELETED

Utils.Methods.copyMap()           -> Utils.Window.copyObject();
Utils.Methods.populateMap()       -> DELETED

Utils.Methods.warn()              -> Utils.Window.warn();
Utils.Methods.setTimeout()        -> Utils.Window.setTimeout();
Utils.Methods.objEq()             -> DELETED
Utils.Methods.isIE()              -> DELETED
Utils.Methods.parseRange()        -> DELETED

Utils.Methods.colorTest()         -> Utils.Color.colorTest();
Utils.Methods.lightenColor()      -> Utils.Color.lightenColor();

Utils.Methods.intersectsBBox()    -> Utils.DOM.intersectsBBox();

Bugfixes

• Plot.Area now cleans up correctly when Datasets are removed.
• QuantitativeScale now ignores strings and other invalid values when computing the extents, rather than choking on them.

1.0.0 Release Candidate 4

Overview

Why 1.0.0?

There are a number of known issues in the Plottable API that require breaking backwards compatibility to fix. That means there are a number of backwards-incompatible changes in this release. We are working hard to remedy these problems, and get the API in a state that will allow us to maintain backwards compatibility for all releases after v1.0.0.

To provide the best experience to our users, we are rolling out incremental release candidate releases to allow for pre-integration testing. These release candidates are not meant for production, but are meant as testing resources.

Theme of the 1.0.0-rc series

Because of the breaking changes between v0.54.0 and v1.0.0, our goal is that these release candidates will help make the upgrade as smooth as possible for you all, by allowing you to test early, and often.

Please test with these release candidates and make sure you're able to migrate to the new feature set without losing functionality. If you encounter any issues, please file issues here.

A description of the major changes is below. Full instructions on migrating from v0.54.0 to v1.0.0 will be kept updated in our Upgrading to 1.0.0 Guide.

D3 definitions file update

This release candidate uses a new version of d3.d.ts.

This latest version is vastly different from the one that came before. The author of that change describes the changes in detail here.

• When upgrading, use the version in the Plottable repository, because it contains fixes for the latest version of the D3 definitions file.
• For those interested, the fixes are in the process of making it to DefinitelyTyped. Follow the pull request here.

API Changes between 1.0.0-rc3 and 1.0.0-rc4

Axes.Category

• The orientation parameter in the constructor is now required:

constructor(scale: Scales.Category, orientation: string, formatter?: (d: any) => string);

Drawer

• Plottable.Drawers.AbstractDrawer has been renamed to Plottable.Drawer
• The setClass() endpoint has been removed.

Drawers.Element

• The svgElement() endpoint has been removed.

Drawers.Rectangle

• Drawers.Rect has been renamed to Drawers.Rectangle.

Plots.Bar

• The barAlignment() endpoint has been removed. The original goal for that API point was to allow for histogram-like visualizations. We will be implementing a Histogram class post 1.0.0.
• orientation() can be used to get the current orientation of the Plots.Bar ("vertical" or "horizontal").
• baseline() has been renamed to baselineValue(), which more accurately reflects what the method does.

Scale

addExtentsProvider() and removeExtentsProvider() have been replaced by the following methods:

addIncludedValuesProvider(provider: Scales.IncludedValuesProvider<D>): Scale<D, R>;
removeIncludedValuesProvider(provider: Scales.IncludedValuesProvider<D>): Scale<D, R>;

These methods take an IncludedValuesProvider, which replaces ExtentsProvider:

interface IncludedValuesProvider<D> {
    (scale: Scale<D, any>): D[];
}

An IncludedValuesProvider is a function that returns an array of domain values. Those values will be included in the domain of the Scale when it autoDomain()s.

QuantitativeScale

• addIncludedValue() and removeIncludedValue() have been replaced by addIncludedValuesProvider() and removeIncludedValuesProvider(), listed above.
• A similar structure has been adopted for padding exceptions:

addPaddingExceptionsProvider(provider: Scales.PaddingExceptionsProvider<D>): QuantitativeScale<D>;
removePaddingExceptionsProvider(provider: Scales.PaddingExceptionsProvider<D>): QuantitativeScale<D>;

These methods take a PaddingExceptionsProvider:

interface PaddingExceptionsProvider<D> {
  (scale: Scale<D, any>): D[];
}

A PaddingExceptionsProvider is a function that returns an array of domain values. If any of those values are either end of the domain computed when autoDomain()-ing, that end of the domain will not be padded.

XYPlot

• autorange() now functions as a getter, returning the current autorange mode ("x"/"y"/"none").

Type renames

• _Projector -> Projector
• _Projection removed, since is has been superseded by Plots.AccessorScaleBinding<any, any>

1.0.0 Release Candidate 3

Overview

Why 1.0.0?

There are a number of known issues in the Plottable API that require breaking backwards compatibility to fix. That means there are a number of backwards-incompatible changes in this release. We are working hard to remedy these problems, and get the API in a state that will allow us to maintain backwards compatibility for all releases after v1.0.0.

To provide the best experience to our users, we are rolling out incremental release candidate releases to allow for pre-integration testing. These release candidates are not meant for production, but are meant as testing resources.

Theme of the 1.0.0-rc series

Because of the breaking changes between v0.54.0 and v1.0.0, our goal is that these release candidates will help make the upgrade as smooth as possible for you all, by allowing you to test early, and often.

Please test with these release candidates and make sure you're able to migrate to the new feature set without losing functionality. If you encounter any issues, please file issues here.

A description of the major changes is below. Full instructions on migrating from v0.54.0 to v1.0.0 will be kept updated in our Upgrading to 1.0.0 Guide

API Changes between 1.0.0-rc2 and 1.0.0-rc3

The changes below outline updates to the API that were not included in the 1.0.0-rc2 release.

public _methodNameHere methods

The following methods are no longer public:

• getAnimator() on StackedAreaPlot is now protected (inline with all the classes in the inheritance tree)
• _timeoutMsec on RendererPolicies.Timeout is now private
• _autoDomainIfAutomaticMode() on the QuantitativeScale is now protected

Label constructor takes angle

The Label angle can now be set in the constructor:

var label = new Plottable.Components.Label("My Label", 0);

Valid angles are -90, 0 (horizontal), and 90.

Plots.Rectangle

• Plots.Grid has been removed. Its functionality has been folded into Plots.Rectangle
• Plots.Rectangle has four property setters: .x(), .x2(), .y(), .y2(). The x()/x2() properties use the same Scale, as do the y()/y2() properties.

Utils.Stacked

The class has been simplified:

• Renamed Plottable.StackedPlotUtils -> Plottable.Utils.Stacked
• Documentation added
• keyAccessor() method removed as it was implementing Plot logic
• valueAccessor() method removed as it was implementing Plot logic
• checkSameDomainForStacks() moved to Plots.StackedArea as it was only used there
• domainKeys() now public

Axes.Numeric

• showEndTickLabel() has been removed. The function in its current state did not do anything and it did not seem to be tested at all, meaning that it looks like dead functionality.

Drawer

• Constructor takes in a Dataset instead of a string key
• _getPixelPoint() has been removed.

Drawers.Rect

• drawText() has been removed
• removeLabels() has been removed
• _getIfLabelsTooWide() has been removed

Cleaning up CSS files

Some unused CSS classes have been removed from plottable.css. Changes can be seen here.

Retrieve internal Drag Interaction from DragBoxLayer

• dragInteraction() can be used to retrieve the internal Drag Interaction from DragBoxLayer. One possible use of this feature is to disable drag functionality temporarily:

dragBoxLayer.dragInteraction().detachFrom(dragBoxLayer); // disable
dragBoxLayer.dragInteraction().attachTo(dragBoxLayer); // enable

Plots

• getAllSelections() no longer takes in a boolean exclude parameter as an the second parameter.
  To get Selections for a certain subset of Datasets:

var datasetsToExclude = [...];
var datasetExclusionFilter = function(dataset) { return datasetsToExclude.indexOf(dataset) === -1; }
var unexcludedDatasets = plot.datasets().filter(datasetExclusionFilter);
plot.getAllSelections(unexcludedDatasets);

Plots no longer take Scales in the constructor

The X and Y Scales were already being passed in through .x(), .y(), so their inclusion in the constructor was redundant.

Previously:

var plot = new Plottable.Plots.Bar(xScale, yScale);

Now:

var plot = new Plottable.Plots.Bar();

The new constructor signatures are:

• new Plottable.Plot()
• new Plottable.XYPlot<type, type>()
• new Plottable.Plots.Pie() <- unchanged
• new Plottable.Plots.Bar<type, type>(orientation?)
• new Plottable.Plots.StackedBar<type, type>(orientation?)
• new Plottable.Plots.ClusteredBar<type, type>(orientation?)
• new Plottable.Plots.Line<type>()
• new Plottable.Plots.Area<type>()
• new Plottable.Plots.StackedArea<type>()
• new Plottable.Plots.Rectangle<type, type>()
• new Plottable.Plots.Scatter<type, type>()

Upgrade Regex

• FIND: (\.Plots\.[^\(]*\()[^,\)]*(, )?[^\),]*(, )*
• REPLACE: $1

In addition to this, the following method signatures have been changed to not require a Scale anymore. The Scale was redundant because it was already specified on the respective .x(), .y()

• Plots.Area.y0(y0?: number | Accessor<number>): any
• Plots.Rectangle.x2(x2?: number | Accessor<number> | X | Accessor<X>): any
• Plots.Rectangle.y2(y2?: number | Accessor<number> | Y | Accessor<Y>): any

PlotData --> Entity

The PlotData type has been removed. Methods that previously returned PlotData now use the Entity type:

export type Entity = {
  datum: any;
  index: number;
  dataset: Dataset;
  position: Point;
  selection: D3.Selection;
  plot: Plot;
}

The names of corresponding methods have been changed:

• getAllPlotData() --> entities():

public entities(datasets = this.datasets()): Plots.Entity[];

• getClosestPlotData() --> entityNearest():

public entityNearest(queryPoint: Point): Plots.Entity;

On Plots.Bar, getBars() has been split into:

public entitiesAt(p: Point): Entity[];

and

public entitiesIn(bounds: Bounds): Entity[];
public entitiesIn(xRange: Range, yRange: Range): Entity[];

Key differences:

• Entity corresponds to exactly one datum and its visual representation on the screen.
• The Dataset containing datum, as well as datum's index in that Dataset, have been included.
• The originating Plot for the Entity is also included, which may be helpful if the Entity is saved off somewhere after it has been created.

RenderPolicy

• .setRenderPolicy() no longer takes a RenderPolicy. The following stringy enums are available.

export module Policy {
    export var IMMEDIATE = "immediate";
    export var ANIMATION_FRAME = "animationframe";
    export var TIMEOUT = "timeout";
}

Animator

• All plot Animators now have keys of "main" and "reset" for the Animator.Baseline() and Animator.Null() states, respectively.

1.0.0 Release Candidate 2

Overview

Why 1.0.0?

There are a number of known issues in the Plottable API that require breaking backwards compatibility to fix. That means there are a number of backwards-incompatible changes in this release. We are working hard to remedy these problems, and get the API in a state that will allow us to maintain backwards compatibility for all releases after v1.0.0.

To provide the best experience to our users, we are rolling out incremental release candidate releases to allow for pre-integration testing. These release candidates are not meant for production, but are meant as testing resources.

Theme of the 1.0.0-rc series

Because of the breaking changes between v0.54.0 and v1.0.0, our goal is that these release candidates will help make the upgrade as smooth as possible for you all, by allowing you to test early, and often.

Please test with these release candidates and make sure you're able to migrate to the new feature set without losing functionality. If you encounter any issues, please file issues here.

A description of the major changes is below. Full instructions on migrating from v0.54.0 to v1.0.0 will be kept updated in our Upgrading to 1.0.0 Guide

API Changes between 1.0.0-rc1 and 1.0.0-rc2

The changes below outline updates to the API that were not included in the 1.0.0-rc1 release.

Core.Colors

Core.Colors has been deleted. Since the default Plottable colors are now driven by CSS, you can retrieve the colors using:

var colors = new ColorScale().range();

Plots

• generateProjectors() has been removed.

Plots.Bar

The orientation of Plots.Bar is now set as follows:

new Plots.Bar(xScale, yScale, Plots.Bar.ORIENTATION_VERTICAL);
new Plots.Bar(xScale, yScale, Plots.Bar.ORIENTATION_HORIZONTAL);

Plots.StackedPlot

StackedPlot was transformed into a set of static utilities called Plottable.StackedPlotUtils. This will move to Plots.StackedPlotUtils in rc3.

Plots.XYPlot

The methods automaticallyAdjustXScaleOverVisiblePoints() and automaticallyAdjustYScaleOverVisiblePoints() have been combined into a single method, autorange(). The autorange functionality is now set as follows:

xyPlot.autorange("x"); // to adjust the x scale based on the y domain
xyPlot.autorange("y"); // to adjust the y scale based on the x domain
xyPlot.autorange("none"); // to disable this functionality completely.

Legend

• .sortFunction() -> .comparator()

Accessor

• The signature for an Accessor has been changed to not include the PlotMetadata as an argument:

export interface Accessor<T> {
  (datum: any, index: number, dataset: Dataset): T;
}

Label

• orientation(orientation: string) is now angle(angle: number)
• The orientation is no longer set in the constructor:

var label = new Plottable.Components.Label("My label");
label.angle(-90); // rotated 90 degrees counter-clockwise

Domainer functionality moved to QuantitativeScale

Domainers have been removed. Domainers were previously used when autoDomain()-ing a QuantitativeScale; their functionality has been moved to the QuantitativeScale itself:

padProportion(): number;
padProportion(padProportion: number): QuantitativeScale<D>;
addPaddingException(key: any, exception: D): QuantitativeScale<D>;
removePaddingException(key: any): QuantitativeScale<D>;
addIncludedValue(key: any, value: D): QuantitativeScale<D>;
removeIncludedValue(key: any): QuantitativeScale<D>;

domainMin() and domainMax()

Two methods have been added for setting only one end of the domain on QuantitativeScale:

• domainMin(min) sets the lower end of the domain.
• domainMax(max) sets the upper end of the domain.

If only one is set, the other end of the scale will behave as though it was autoDomain()-ed. The methods can also be used to retrieve the current min and max values of the domain.

Calling both domainMin(min) and domainMax(max) is equivalent to callingdomain([min, max]). Setting both can reverse the domain onQuantitativeScale`s that support reversal.

Calling autoDomain() will clear both set values, the same way calling autoDomain() overrides domain().

Example fiddle: http://jsfiddle.net/temt44gx/7/

1.0.0 Release Candidate 1

Overview

Why 1.0.0?

There are a number of known issues in the Plottable API that require breaking backwards compatibility to fix. That means there are a number of backwards-incompatible changes in this release. We are working hard to remedy these problems, and get the API in a state that will allow us to maintain backwards compatibility for all releases after v1.0.0.

To provide the best experience to our users, we are rolling out incremental release candidate releases to allow for pre-integration testing. These release candidates are not meant for production, but are meant as testing resources.

Theme of the 1.0.0-rc series

Because of the breaking changes between v0.54.0 and v1.0.0, our goal is that these release candidates will help make the upgrade as smooth as possible for you all, by allowing you to test early, and often.

Please test with these release candidates and make sure you're able to migrate to the new feature set without losing functionality. If you encounter any issues, please file issues here.

A description of the major changes is below. Full instructions on migrating from v0.54.0 to v1.0.0 will be kept updated in our Upgrading to 1.0.0 Guide

Major changes

Replacing project()

project() previously performed a lot of magic in the background. For example, calling

plot.project("fill", function(d) { return "red"; });

would set the "fill" attribute in the DOM to "red", but calling

plot.project("x", ...);

set a variety of DOM attributes depending on what kind of Plot was used.
Furthermore, if the second argument to project() was a string, it would automatically be used as a key into the data (unless the string began with "#"...), meaning that .project("fill", "red") didn't do what might be expected.

We have decided to remedy this by splitting the functionality of project() into different functions.

Using attr() to set attributes

attr() previously existed as an alias for project(). Now, it directly sets DOM attributes to the results of an Accessor and a Scale:

attr(attr: string, attrValue: number | string | Accessor<number> | Accessor<string>): Plot;
attr<A>(attr: string, attrValue: A | Accessor<A>, scale: Scale<A, number | string>): Plot;

Example invocations:

• plot.attr("stroke-width", 2);
• plot.attr("fill", "pink");
• plot.attr("fill", function(d) { return d.value >= 0 ? "green" : "red"; });
• plot.attr("stroke", function(d) { return d.type; }, colorScale);

The Scale must be passed as the third argument for it to autoDomain() over the data passing through it.

attr() can also be invoked at as a getter that returns the Accessor-Scale binding for a particular attribute:

interface AccessorScaleBinding {
  accessor: Accessor;
  scale?: Scale;
}

Property setters

There are now methods for setting Plot properties that are not actual DOM attributes. These have a similar signature to attr(), taking in an Accessor function and a Scale. An Accessor has this signature:

interface Accessor<T> {
  (datum: any, index: number, dataset: Dataset, plotMetadata: Plots.PlotMetadata): T;
}

Note that the third argument is now the Dataset, rather than just the metadata() from the Dataset.

Here's an example property setter:

x(x: number | Accessor<number>): XYPlot<X, Y>;
x(x: X | Accessor<X>, xScale: Scale<X, number>): XYPlot<X, Y>;

x() is used to set the "x" property on an XYPlot: the previous invocation would have been something like project("x", function(d) { return d.x; }, xScale). Now, instead:

plot.x(function(d) { return d.x; }, xScale);

Here is the list of property setters:

• All XYPlots: x() and y()
• Plots.Area: y0
• Plots.Grid: x2() and y2()
• Plots.Pie: innerRadius(), outerRadius(), and sectorValue()
• Plots.Scatter: size() and symbol()

Methods and Fields Renamed

A number of methods and protected fields have changed. These are documented in the upgrading guide: https://github.com/palantir/plottable/wiki/Upgrading-to-1.0.0

Bugfixes

• Interaction.PanZoom now works well when attaching a Scale.ModifiedLog to it.
• Registering Interaction.PanZoom before the plot has rendered does not break.
• If you were previously using a Scales.Color inside an Accessor:

plot.project("fill", function(d) { return colorScale.scale(d.type); });

The Scale's domain would have expanded to cover all the data, which was an error. Scales must be passed as the third argument to attr() (or the second argument to the property setters) for the Scale to autoDomain() over all the data. Instead, do this:

plot.attr("fill", function(d) { return d.type; }, colorScale);

Interaction Changes

Good evening,

Today's release includes an upgrade to Axis.Time, a new implementation for drag boxes, and a few other Interaction upgrades.

Features

Arbitrary number of tiers on Axis.Time

Previously, Axis.Time supported a maximum of two tiers; now it supports any number of tiers. To use this feature, pass a larger number of TierConfigurations into the axisConfigurations() method:

var twoTierAxisConfig = [
  tier1Config,
  tier2Config
];

var threeTierAxisConfig = [
  tier1Config,
  tier2Config,
  tier3Config
];

timeAxis.axisConfigurations([
  twoTierConfig,
  threeTierConfig,
  ...
]);

Try it out: http://jsfiddle.net/xs3zps5w/

Interaction.Drag

Interaction.Drag has been refactored. You can register for events with the following methods:

• onDragStart(callback): The callback will be passed the starting point of the drag gesture.
• onDrag(callback): The callback will be passed the starting point and current location of the drag gesture.
• onDragEnd(callback): The callback will be passed the starting point and ending point of the drag gesture.

In addition, setupZoomCallback() has been removed (it was broken anyway). See the section on Component.DragBoxLayer to see how to implement this functionality.

Try it out: http://jsfiddle.net/fgns88L7/2/

Component.SelectionBoxLayer

This Component draws a translucent box in the space it occupies. The bounds of the box can be set using the bounds() method:

bounds(newBounds: Bounds): SelectionBoxLayer;

A Bounds object is used to specify the location of the corners of the box:

/**
 * The corners of a box.
 */
export type Bounds = {
  topLeft: Point;
  bottomRight: Point;
}

In a Bounds object, the topLeft is always the top-left Point of the drag box, regardless of how the user is creating or resizing the box.

The box can be shown or hidden using the boxVisible() method. Note that the visible box does not necessarily occupy all of the space in the SelectionBoxLayer.
Try it out: http://jsfiddle.net/4pb2yw1y/4/

The box can be re-styled by changing the CSS rules for .plottable .selection-box-layer .selection-area.
Try it out: http://jsfiddle.net/4pb2yw1y/5/

DragBoxLayer

A DragBoxLayer is a SelectionBoxLayer with an Interaction.Drag already hooked up. You can register for events on DragBoxLayer:

• onDragStart(callback)
• onDrag(callback)
• onDragEnd(callback)

The callbacks passed to the above methods will be called with the current bounds() of the box.

Finally, the box can be made resizable by calling resize(true) on the DragBoxLayer.

Try it out: http://jsfiddle.net/5L700d8w/

An example showing how to zoom in after a drag: http://jsfiddle.net/sazokb53/

DragBoxLayer replaces Interaction.DragBox; see "API-Breaking Changes and Upgrade Instructions" for how to make the transition.

XDragBoxLayer and YDragBoxLayer

These are subclasses of DragBoxLayer that only allow selection in a single dimension.

Try them out: http://jsfiddle.net/5fpvyzu0/

Interaction.DoubleClick

Interaction.DoubleClick has been refactored. You can register for the double-click event with the following method:

• onDoubleClick(callback): The callback will be passed the point that was double-clicked.

Note that a double-click event is defined by two consecutive mouse click-downs and click-ups within the span of the system-determined double-click speed.

Try it out: http://jsfiddle.net/gzo2vjha/

Dispatcher.Touch can work on multiple touches

The callbacks in the API for Dispatcher.Touch now have a different signature to account for multiple touches:

type TouchCallback = (ids: number[], idToPoint: { [id: number]: Point; }, e: TouchEvent) => any;

Each Touch has a unique identifier, stored in the ids array. idToPoint stores the location of the touch with a given identifier.

Bugfixes

• Interaction.Drag now works under CSS transforms (#1497) and zooming in IE9 (#1491).
• Constrained tick labels on Axis.Numeric now display better (#1118).
• Components that are already rendered can be moved into Groups (1823.
• Plot.StackedBar, Plot.StackedArea, Plot.Pie, and Plot.Grid now handle NaN and undefined data more gracefully (#1838, #1844, #1850, #1851)

API-Breaking Changes and Upgrade Instructions

Interaction.Drag callbacks

The methods for registering callbacks on Interaction.Drag have been renamed, although the signatures of the callbacks passed in have not:

• .dragstart() → onDragStart()
• .drag() → onDrag()
• .dragend() → onDragEnd()

Component.DragBoxLayer replaces Interaction.DragBox

To add a drag box to a Plot:

New way: Create a Component.DragBoxLayer and combine it with the Plot using a Group.

• example: http://jsfiddle.net/77p0z2mj/1/

Old way: Create an Interaction.Dragbox and register it to the Plot.

• example: http://jsfiddle.net/dLz743gd/5/

The methods for registering callbacks on DragBoxLayer have also been renamed:

• .dragstart() → onDragStart()
• .drag() → onDrag()
• .dragend() → onDragEnd()

Callbacks registered to onDragStart(), onDrag(), and onDragEnd() are now passed the Bounds of the DragBoxLayer:

export type Bounds = {
  topLeft: Point;
  bottomRight: Point;
}

The CSS classes associated with a drag box have also changed, as well as the default stylings. To control the appearance of the box on DragBoxLayer, CSS classes should be set on .drag-box-layer .selection-area. For example, the following code will make the drag box look as it did on previous versions:

.plottable .drag-box-layer .selection-area {
  fill: aliceblue;
  fill-opacity: .7;
  stroke: #C0C8FF;
}

Release Song

Two Weeks, Grizzly Bear: https://www.youtube.com/watch?v=sPXDJQkuWeA

Improvements to getClosestPlotData()

Good afternoon,

This release features more nuanced default behavior for getClosestPlotData().

Features

Improvements to getClosestPlotData()

We've simplified the API. It now accepts a query point only:

getClosestPlotData(queryPoint: Point): PlotData;

and the notion of "closest" differs by plot type:

• Scatter, Pie, and Grid Plots retain the Euclidean norm
• Line and Area Plots implement an x-then-y strategy; points are first compared by x-value and, if multiple points have the same x-value, their y-value is used as a tiebreaker
• Bar Plots implement a similar x-then-y strategy, with the addition that bars containing the query point are always returned. For horizontal Bar Plots, the strategy is y-then-x.

This makes it easy to show plot data tooltips in a user-friendly way.
Try it out here: http://jsfiddle.net/38ehL9p6/1/

Bugfixes

• Plottable stops reading colors from CSS when a maximum of 256 colors is reached (#1834)

Typescript-only API-Breaking Changes

• getClosestPlotData() no longer accepts the two (optional) parameters withinValue and datasetKeys.

Component.Group improvements, refactored Interaction.Click

Good afternoon,

Today's release features improvements to Component.Group, as well as a refactoring of Interaction.Click.

Features

Adding Components to filled cells in Table

Adding a Component to a Table cell that is already occupied will now merge it above the Component that is already there, creating a Group. If the Component being added or the Component already there is a Group, they will be combined using above().

See it in action: http://jsfiddle.net/3h567a36/1/

Interaction.Click Restructured

Interaction.Click now uses the new Interaction architecture -- this means it will now return the correct position even when CSS transforms have been applied to the page. The callback registration method has been renamed to onClick().

Example Usage:

var clickInteraction = new Plottable.Interaction.Click();
clickInteraction.onClick(function(point){
  // do something with the resultant Point -- maybe select an element?
  ...
});
plot.registerInteraction(clickInteraction);

See it in action: http://jsfiddle.net/uztbyhnz/1/

Bugfixes

• Component.Group no longer produces extra whitespace. Essentially, Group will behave with the combined effect of each of its constituent Components added to a Table cell individually (#1791).
• An Axis.Time with only single-tier configurations no longer occupies extra space where the extra tier would have been (#1800).

API-Breaking Changes

• Interaction.Click's callback setter has been replaced with an onClick getter/setter API.

Upgrade Instructions

• In places where you are using clickInteraction.callback(callback), this should be replaced with clickInteraction.onClick(callback).

Release Song

Jason Mraz - Geek in the Pink