New Sample Diagram: “Journey”

There’s a new Sample Diagram to try out at the top of the Build-a-Diagram page: Journey, which demonstrates how you can produce traceable paths for multiple players across multiple stages by using a specific approach to encoding your data.

It was added in February of this year. The conditions required for this kind of diagram to work are:

  • Each flow maintains a single color from start to end.
  • All flows for a particular player must be listed together.
  • The “Arrange the Diagram” control must be set to “Using the exact input order”.

In the sample diagram, every flow for every player has the same value (1), but that condition isn’t absolutely necessary as long as the other conditions are met.

This diagram style can be used for such things as a ranking chart for team standings in a league (sometimes called a “bump chart”).

This post prompted me to go track down when each of the other sample diagram types was added, for comparison:

Before & After: Social header image

There have been many changes to SankeyMATIC in the last year.

One quick snapshot of what’s changed can be seen in the updated header image on social media which shows off new examples of what you can do on the site; the old & new images are attached here so you can see some of the differences, especially in how much easier the labels can be to read.

(adapted from

More on New Label Features

Two upcoming SankeyMATIC Label features about to ship –

New Feature #1 – Placement & sizing

Names and Values can be placed on separate lines and can be given different sizes.

The Job Search example shows how this can allow larger & more readable labels by using the available space differently:

New Feature #2 – Scaling based on value

You can make each label larger or smaller based on the amount it represents.

The Financial Results example shows how this can help draw attention to specific areas of your image:

Open the ‘Labels‘ panel in the left column to use the new features.

(cross-posted from

December 2021: Sliders and Samples

New Feature: Sliders now produce ‘live’ changes

Appearance controls which use sliders (examples: Curviness, Node Opacity, Flow Opacity, Border Width) now make immediate changes to the diagram as you drag them.

This makes it much easier to observe what each slider is doing and to precisely pick the value you want.

Small screenshot showing the 'Curviness' slider from the SankeyMATIC Build page

Added multiple sample diagrams

Now there are 3 different diagrams you can use as starting points when you first begin.

Note: When you have made any changes to the Inputs field, choosing a new base diagram will alert you that you will lose your changes if you continue.

Other minor changes

  • In the Inputs section, comments are now indicated using two slashes (“//”) instead of an apostrophe.
    • The double slash is a standard comment marker for many languages and formats, so this will hopefully be more familiar to more people.
    • Typing apostrophes on iOS devices defaulted to the ‘smart’ version, making it require several steps to successfully enter a comment. This change eliminates that difficulty.