Key points
Best Practices
In COVE the states are called nodes, and the paths between the nodes are called links. The two nodes connected by a link are its source node (left side) and target node (right side). In the Sankey diagram below, the source node on the far left has links to two target nodes: "Completed Protocol" and "Aborted Protocol." The key story presented here is that, of 85,865 patients, the vast majority completed their treatment. The diagram completes with links from "Completed Protocol" to its three target nodes to show some after-treatment data.
The size of each node and the width of each link are proportional to the quantity represented. The total volume entering a node equals the total volume exiting the node.
Sankey diagrams can in effect show at a high level the key data points related to complex processes, such as capacity and distribution.
Source data files for COVE Sankey diagrams must be in JSON format. Note the following sections:
- links: This is the most critical section in the JSON file. From this section COVE generates the nodes and links. The screenshot below shows the definition of the two links from the far-left node in the diagram above to its target nodes "Completed Protocol" and "Aborted Protocol." (The node label "In Treatment Protocol" does not display in the diagram because story text, as explained below, has been specified for the node to provide the year information.)
- storyNodeText: The source file can include specifications for extra node text to provide more context or to simply make the diagram easier to follow. You can include this text in the source file or enter it in the COVE editor. Either way, a maximum of 3 nodes can have story text. The screenshot below shows the story text specification for the far-left node "In Treatment Protocol."
- tooltips: Sankey diagrams typically present high-level information, but you can add tooltips to the nodes. If you are not including tooltips, you should still include an empty tooltips section. To see another example diagram both with and without tooltips, along with its source file, go to the examples at the bottom of the page.
- tableData: To meet accessibility standards, each data visualization must have a supporting data table. Because of the unique structure of Sankey data, the data table contents must be specified in the source file. Make certain you include all key data points shown in the visualization. The screenshot below shows the first three rows of the data table for the example diagram at the top of the page. There are two columns: Protocol Status and Number of Patients.
In public health communications, Sankey diagrams are typically used to show the flow of patients through a healthcare system. But the Sankey is a very flexible visualization tool that can be used in a variety of ways as long as it shows flow, movement, or change.
It is best used when the following conditions apply:
- You are communicating an overall trend, not specific values.
- You have a small number of nodes and links to visualize. (If you have a large number of nodes, consider taking your visualization to a higher level.)
Keep in mind that even simpler Sankey diagrams can be hard to interpret for some viewers. Some of your viewers may not be familiar with the conventions of Sankey diagrams. Briefly explain to your readers how to read the diagram. (COVE currently requires a subtext / description for Sankey diagrams. You can use this text slot to explain the diagram.)
Note on Mobile Display:
In the smallest viewport, the visualization instructs the user to turn their phone to landscape because Sankey diagrams are not really built for vertical phone sizes.
Quick Build Notes
- Select a Sankey diagram as the Visualization Type.
- Upload your data.
- Type in the title and other text fields in the General panel.
- Adjust the height of the chart to at least 500.
- Make sure the subtext is filled in.
- Ensure that at least 2 nodes have story node text in the Sankey panel.
Configuration Options
The example visualizations below highlight options available for Sankey diagrams. Key configuration selections are in the build notes section under each example.
For in-depth configuration information visit the Configuration Options section.
Sankey Diagram with Tooltips Enabled
Sample Data: Example Sankey Data
- Story Node Text: Suicide EMS Responses
- Story Text Before: In 2022, there were
- Story Text After: Suicide EMS Responses
- Story Node Text: Treated
- Story Text Before: of which,
- Story Text After: were treated
- Story Node Text: Transported to hospital
- Story Text Before: and
- Story Text After: were transported to the hospital
- Enable Tooltips
Sankey Diagram with Tooltips Disabled
Sample Data: Example Sankey Data
- Story Node Text: Suicide EMS Responses
- Story Text Before: In 2022, there were
- Story Text After: Suicide EMS Responses
- Story Node Text: Treated
- Story Text Before: of which,
- Story Text After: were treated
- Story Node Text: Transported to hospital
- Story Text Before: and
- Story Text After: were transported to the hospital