Frequently Asked Question
How does TernaryPlot.com make money?
It doesn't, it's provide for your convenience for free, thats why you should donate!. If not enough people donate, many features of TernaryPlot.com will become premium.
What is that floating red dot on top the plot and how do I get rid of it?
The floating red dot is the dot that reads the ternary value of the current mouse position. You can turn it off by clicking on the "Interactive" toggle button below the plot.
I need more than 90 rows in the table, how do I add rows?
Currently adding rows is not supported.
I want to show just a part of the plot, how do I do that?
Click the plot configuration button and enter the subdomains in the domains section in the plot configuration panel. Be sure the enter domains are of equal length. For example, this is correct
A: 0 - 0.7, B: 0 - 0.7 C: 0.3 - 1, all domains are of length 0.7. While the following is incorrect
A: 0 - 0.7, B: 0 - 0.7 C: 0.2 - 1, because the the last domain is 0.1 'longer'.
How do I quickly enter data?
You can paste values directly from Excel or Google Sheets into multiple data cells. Select and copy multiple cells in Excel/Google sheets. In the table on TernaryPlot.com, select the first cell you want to copy to and hit paste, now multiple cells will be set.
Using a csv file
I think this is the best way
- Click the download button and click "CSV" above the table you want to enter data into
- Open the downloaded CSV file in Excel (or something else) and add your data in the a, b, c columns. Do not edit the column names, so do NOT replace a,b,c and with labels for your data. Just leave the first row as it is.
- Check your data
- Use a dot as a decimal separator.
- Make sure the first three column names are "a, b, c"
- Make sure your values are allowed, for example a symbol of a point can be only one of the 7 symbol types and point sized can't be negative.
- When you're done editing your data, save it as a CSV file.
- On TernaryPlot.com, go to the table you want to enter data into and click the upload button above the table
- Select your edited CSV file and confirm
- An alert appears stating which columns are read, and which columns are ignored. You should now see the data in the table and on the plot, hooray!
How do I save data?
Data is saved in your browser everytime you stop editing a table. You can also click the green download button above a table to download the table data.
The plot is inverted, how do I reverse the axes?
The plot is not inverted, perhaps you are reading the axes in reverse. If you want the axes reversed, click the "Plot configuration" button below the plot, then click the "Reverse domains" button in the Plot Configuration panel.
If you have set custom domains and are seeing strange plot results, then you have likely entered incorrect values for the domains.
I need more advanced features like binning and contouring, what should I do?
If TernaryPlot.com does not satisfy your demands for ternary plots, check out one of the following libraries.
Entered data is normalized automatically i.e. proportions are calculated of any three positive values you enter. This means you do not need to calculate the percentages yourself first.
Rename your data headers (i.e. data column names) by clicking on them in any table. The data headers are synced between all tables.
Starting a new line or area
To start a new line or area, disable a row between the rows of the lines. Only the style properties of the first row of a line or area are applied. The subsequent style properties are ignored.
|0||0||0||Unchecked row to separate lines|
Your data is saved automatically locally in your browser everytime you stop editing a table. So when you come back TernaryPlot.com later, you'll be asked whether you want to reload your prior data. See also, the sections on downloading and uploading a csv file for saving data in the tables as csv files
Download the table data by clicking the download button above a table and selecting the desired format. You can download data as either CSV or a JSON file.
Uploading data with a csv file
CSV files can be uploaded and read into the table provided they are formatted correctly and contain the right column names. Click upload button above a table and select your csv file. The right column names per type are listed below, for your convenience you can click on of the headers to copy them. Also make sure your entered values are correct, for example a symbol of a point can be only one of the 7 symbol types and a color must be a valid color.
To mark the end of a line or area, set the value of
false for the next row.
Note that you should name the data headers a, b, and c. Already naming the data columns in the csv file will not work. When uploading, an alert appears stating which columns will be read, and which columns will be ignored.
The following properties apply to all types of plot elements
- A value between 0 and 1. Opacity is the opposite of transparency.
- Enter a color in one the following formats or click the color box on the right side to open a color picker.(The color picker varies per browser and operating system)
- The SVG title attribute of the element. This does not add text, it only sets the text in box that shows up when you hover your mouse over something. If you want to add text to the plot, add it in in the text table.
The following properties of point elements are configurable.
- Select one of the folowing symbols
- Circle (default)
- The size of the symbol in pixels
- See opacity in shared properties
- Fill color
- Fill color is the color of the inside of the symbol. See color on how to enter colors.
- Stroke color
- The colors of the stroke (i.e. border) of the symbol. See color on how to enter colors.
The following properties of text elements are configurable.
- The text that should be plotted
- Font size
- The font size in pixels
- See opacity in shared properties
- Text anchor
- How to place the text relative to its coordinate anchor. Choose either
- The rotation of the text in degrees. The point of rotation is determined by the text anchor.
- The color of the text. See color on how to enter colors.
- Curve type
- There are different ways to connect the points that form a line. A variety of curve types are provided for this purpose. You can select one of the following curve types.
- Linear (default)
- Basis spline
- Catmull–Rom spline
- The width of the line in pixels
- The pattern of dashes and gaps of the line. Select one of the predefined option or enter your own 'stroke-dasharray'. A stroke-dasharray is a list of comma and/or white space separated lengths and percentages that specify the lengths of alternating dashes and gaps. Learn more about stroke-dasharray on MDN.
- Arrow start
- Toggle to attach an arrowhead to the start of the line
- Arrow end
- Toggle to attach an arrowhead to the end of the line
- See opacity in shared properties
- See Title in shared properties.
AreasSo start a new line, disable a row between the rows of the lines.
- Curve type
- See the curve section under "Lines". Curve types work exactly the same for areas.
Configuring the plot
- New Domains
- Enter the values of the new domains and then click the "Set Domains" button. Please double check if the entered domains are correct. The plot will break if the domains are incorrect.
- Reverse domains
- Click to reverse the current domains. Axis ticks and labels are changed automatically to match.
- Label Angles
- The angle of each axis label in degrees.
- Label Offsets
- The offset distance from the vertex of the plot to the axis label in pixels.
- Labels at Center
- Toggle to place labels at the middle of the axis.
- Tick Angles
- The angle of each axis ticks in degrees
- Number of Ticks
- The number of ticks of each axis. The specified count is only a hint, the scale may return more or fewer values depending on the domain.
- Length of Ticks
- The size of each tick in pixels. Negative size means ticks will be placed inside the plot.
- Number of Gridlines
- The numer of gridlines for each axis. The specified count is only a hint, the scale may return more or fewer values depending on the domain.
- Gridlines Color
- The color of the gridlines. To hide the gridlines, set all gridline counts to 0.
- Transparent background
- Toggle to make the background transparent instead of white. The plot will have no background when you download it.
- Clip to ternary plot
- By default, points and lines are clipped to the triangle, meaning any point that falls outside of it is cut off. Toggle to turn clipping on or off.
Downloading the plot
Just hit the download button below the plot, easy as that. You can download the plot in either SVG or PNG
SVG is a terrific vector graphics format that most people don't seem to know about. What makes SVG so good is that – unlike PNG – it's very editable! You can edit text, drag individual elements around, change colors and much more with a vector editing program like Inkscape (free & open-source), Adobe Illustrator, or Sketch. What's more, as its name suggests, SVG's are scaleable.
If you know a little SVG syntax you can open it in a text editor (like VS Code) and edit it directly.
PNG is common format and widely supported but is not easily editable. That's because PNG is a raster-graphics file format, simply a grid of pixels! If you don't need to edit the ternary plot anymore, great, go for PNG. If you want to tweak the downloaded ternary plot, consider SVG.