Skip to content

v3.0.0-beta.4

Pre-release
Pre-release
Compare
Choose a tag to compare
@hellochar hellochar released this 17 Mar 20:02
· 170 commits to develop since this release

This is the fourth in a series of beta releases for the next major revision of Plottable, v3.0.0. Please read on for a list of changes in beta.4, or track the v3.0.0 milestone here.

Features

Canvas Line Plot

This release adds support for rendering Line Plot onto Canvas, supporting the stroke, stroke-width, and opacity properties:

10 datasets, 10k points each

enum objects

We've added enum objects for the following enums:

  • Plottable.Animators.EaseName
  • Plottable.AxisOrientation
  • Plottable.XAlignment
  • Plottable.YAlignment
  • Plottable.Axes.TimeAxisOrientation
  • Plottable.Axes.TierLabelPosition
  • Plottable.Plots.CurveName
  • Plottable.Renderer
  • Plottable.Utils.Stacking.IStackingOrder

This makes it convenient to see what options are available in an enum and makes the code more readable:

new Plottable.Axes.Category(scale, Plottable.AxisOrientation.right);

API Changes

Typescript: Minimum required version 2.1

Our .d.ts files now use the keyof operator which only exists on Typescript 2.1 and above. Upgrade to Typescript 2.1 to prevent compile errors.

Typescript: Some methods now get/set string literal union types

Plottable.Axes.Time.tierLabelPositions(), Plottable.Axes.Time.maxTimeIntervalPrecision(), Component.xAlignment(), Component.yAlignment(), and Plottable.RenderController.renderPolicy() now get/set string literal union types that define exactly the set of acceptable strings. Typescript may throw errors in places that previously worked:

Old:

var xAlign = "left";
component.xAlignment(xAlign); // Argument of type 'string' is not assignable to parameter of type '"left" | "center" | "right"'.

New:

var xAlign: Plottable.XAlignment = "left";
// or
const xAlign = "left";

component.xAlignment(xAlign);
// or
component.xAlignment("left");

Plottable.Components.Alignment renamed

  • Plottable.Components.Alignment.TOP -> Plottable.YAlignment.top
  • Plottable.Components.Alignment.CENTER -> Plottable.YAlignment.center or Plottable.XAlignment.center
  • Plottable.Components.Alignment.BOTTOM -> Plottable.YAlignment.bottom
  • Plottable.Components.Alignment.LEFT -> Plottable.XAlignment.left
  • Plottable.Components.Alignment.RIGHT -> Plottable.XAlignment.right

Plottable.RenderController.Policy enum members camelCased

  • Policy.IMMEDIATE -> Policy.immediate
  • Policy.ANIMATION_FRAME -> Policy.animationFrame
  • Policy.TIMEOUT -> Policy.timeout

Plottable.Plots.Bar.ORIENTATION_VERTICAL and ORIENTATION_HORIZONTAL renamed

  • Plottable.Plots.Bar.ORIENTATION_VERTICAL -> Plottable.Plots.BarOrientation.vertical
  • Plottable.Plots.Bar.ORIENTATION_HORIZONTAL -> Plottable.Plots.BarOrientation.horizontal

Remove Component Box API

Component's .bounding-box element has been removed. Use the .element() method to get the DOM element that bounds a Component.

Component's .background-fill element has been removed. This was added so users could add a background color using CSS chart. Instead, style the .component selector.

Old:

#myChart .background-fill {
  fill: "red";
}

New:

#myChart .component {
  background-color: "red";
}

Bugfixes

  • We now explicitly include @types/d3 as an npm dependency. Previously users needed to manually install @types/d3 when installing Plottable since we expose d3 types in our public API; this should now be installed automatically.
  • Calling plot.selections() on a Canvas Plot will return null instead of throwing an error.