Filled Ternary Plot
A type of plot that depicts the ratio of 3 variables on a triangular grid.
Try an Example
Before getting started with your own dataset, you can check out an example. First, select the 'Type' menu. Hovering the mouse over the chart type icon will display three options: 1) Charts like this by Plotly users, 2) View tutorials on this chart type, and, 3) See a basic example.
Clicking the 'See a basic example' option will show what a sample chart looks like after adding data and editing with the style. You'll also see what labels and style attributes were selected for this specific chart, as well as the end result.
You can also use the data featured in this tutorial by clicking on 'Open This Data in Chart Studio' on the left-hand side. It'll open in Chart Studio.
Add Your Data to Chart Studio
Head to Chart Studio and add your data. You have the option of typing directly in the grid, uploading your file, or entering a URL of an online dataset. Chart Studio accepts .xls, .xlsx, or .csv files. For more information on how to enter your data, see this tutorial.
Create a Chart
After adding data, lets first add a ternary plot to the chart. To do this, go to the 'Traces' section under the 'Structure' menu on the left-hand side. Choose the 'Type' of trace, then choose 'Ternary Scatter' under 'Specialized' chart type. Although we're using 'Ternary Scatter' type trace, the filled area will be added subsequently once we have a raw ternary plot.
Note that each data point on a ternary plot is plotted according to its relative composition with respects to the 3 main axes. For example, the row (10, 0, 90) represents a data point that is made up of 10% of axis A, 0% of axis B and 90% of axis C, this sums up to 100% of this data point's composition with relation to the three axes.
In addition, each column represents an axis for the data points. To plot all your data points on the ternary graph, you will need to map the data columns on the grid to the axes by specifying the values for the attributes 'A', 'B' and 'C' from their respective dropdown menus. Once this mapping is complete, the data points you've entered into the grid will appear on the ternary plot.
To add more traces to the chart, click on the '+ Trace' button at the top right corner of the panel in the 'Traces' section under the 'Structure' menu. Repeat the above steps to map the data columns of the second trace on the grid to the respective axes. Add as many traces as needed, until the ternary plot is complete! This is what the plot looks like after adding all the traces.
Adding the filled area to this ternary plot will be covered in the next step.
Style a Chart
The 'Style' menu displays many options to modify characteristics of the overall chart layout or the individual traces. To see more options about styling the chart, visit the style and layout section of the Chart Studio documentation.
Use the 'General' section under the 'Style' menu to change the general style properties such as plot background color, margin color and font sytlings, the layout properties, the modebar and interactive settings.
To set the plot title, type the title text within the textbox provided under the 'Title' property in the 'General' section.
Another approach is to click and then enter the title directly on the plot interface.
Use the 'Traces' section under the 'Style' menu to change the properties specific to the traces in the plot such as trace's name, color, filled area type and its color, etc.
Now, to add fills to the ternary plot, choose either the option 'To Self' or 'To Next' from the dropdown menu next to the attribute 'Fill To' under the property 'Filled Area'.
'To Self' connects the endpoints of the trace (or each segment of the trace if it has gaps) into a closed shape. 'To Next' fills the space between two traces if one completely encloses the other, and behaves like 'To Self' if there is no trace before it.
Use the 'Axes' section under the 'Style' to change the axes-specific properties such as axes' title, range, and line properties.
To set the axes title, type in the axis title within the textbox provided under 'Title' for each axis or simply click and then enter the axis title directly on the plot interface..
Save and Share
To save the plot click the 'Save' button on the left-hand side. A save modal will appear, as seen below, where you can specify the filenames and privacy settings for your plot and data grid.
For more information on privacy settings and how sharing works, visit Chart Studio's sharing tutorial.
