Albany Tableau Users Group: Bezier Curve 101

Bezier curves are commonly used in graphic design to draw smooth curves. By creating additional data points within Tableau for each 'real' data point, math can be used to implement the bezier curve using data to define the starting point, ending point, and control points defining the curve. The following sequence of examples shows how a single curve is implemented, how it can be used to visualize political terms, and how it can be tweaked to show different shaped arcs like golf drives.

Bezier Curve AnimationTableau ImplementationInverting the CurveSupreme Court Tenure DataBezier Curve Re-creationModifying the Control Points

The animation to the right demonstrates the basic concept behind a quadtratic bezier curve. In general, the bezier curve interpolates between the intitial control points and then continues to interpolate between the resulting points until a single point on the desired curve is determined. The value for t shown in the top left corner ranges from 0 to 1 and represents where in the curve the animation is at. Click/drag on the control points below to see how it affects the curve that is drawn.

Concept and original D3 code modified from: https://www.jasondavies.com/animated-bezier/

Using data densification techniques (creating additional data points for each original/'real' data point), a bezier curve can be implemented in Tableau by feeding in one or more Tableau measures in the bezier formula. In some cases, the bezier curve height can be modified, while the width of the arc is modified in others, if not both.