Skip to content
Web > Charts

Plots and Axes

Known issues

Some chart features have known issues in the current release. See Known issues.

A plot is one drawing area in a chart, and an axis is the scale along one of its edges; this page covers adding plots and axes and setting each axis's range, format, order, and grid lines.

Overview

A chart starts with one plot and 2 axes, one horizontal and one vertical. More plots can be added beside or above the first, so one chart panel shows several charts that share a scale:

  • A horizontal axis belongs to a column of plots: plots one above the other share it.
  • A vertical axis belongs to a row of plots: plots side by side share it.
  • Everything drawn belongs to one plot: its layers, legend, grid lines, and crosshair.

Each plot and each axis has its own settings button in Editor mode.

Adding a plot or an axis

The chart's Plot -> Add submenu adds plots and axes.

  1. In Editor mode, select the chart's edit button, then Plot -> Add.

  2. Select where to add it:

    Item Adds
    "Plot Above", "Plot Below", "Plot to the Left", "Plot to the Right" An empty plot on that side
    "Axis To Left", "Axis To Right", "Axis Above", "Axis Below" An axis on that side of the plot

  3. Check that the new plot or axis is drawn in the chart.

A new plot is empty, with no layers and no grid lines, and has its own settings button. "Plot to the Right" gives it a horizontal axis of its own and shares the existing vertical axis.

An axis's own menu also adds an axis, such as a secondary axis for a second layer: select the axis's settings button, then "Add Axis".

A second plot's settings button opens a "CHART PLOT" menu with "Edit Layers", "Edit Plot", "Add", and "Remove", for that plot. "Remove" lists the plot's layers and "This Plot", which asks "Delete all 1 plot(s) from this col?" before removing it. "This Plot" is unavailable while the chart has only one plot.

Plot settings and grid lines

A plot's settings set its grid lines and the look of its crosshair.

  1. In Editor mode, select the chart's edit button, then Plot -> Edit Plot. The "Edit Plot" window opens.

  2. Change the settings. They apply to the chart as they are changed:

    Setting Default What it sets
    "X Axis Grid:" "Inherit" Vertical grid lines: "Inherit" (from the style), "Show", or "Hide"
    "Y Axis Grid:" "Inherit" Horizontal grid lines, the same way
    "Line Color:", "Line Size (px):", "Line Dash Size:" "Inherit" The crosshair's lines
    "AXIS CHIP" fields "Inherit" The crosshair's axis value chips

  3. Select "OK".

  4. Check that the grid lines show as set.

The window's "CROSSHAIR" section is covered in Crosshair.

Editing an axis

Each axis has its own settings, opened from its settings button.

  1. In Editor mode, select the axis's settings button. A menu headed "CHART AXIS" opens, with "Edit Highlighted Axis...", "Style", "Add Axis", and "Delete Highlighted Axis".
  2. Select "Edit Highlighted Axis...". The "Edit Axis" window opens.

  3. Change the settings. They apply as they are changed:

    Setting Default What it sets
    "Title:" Empty The text along the axis
    "Sub-Title Ordering:" "Sorted" For a category axis, the order of the categories. See Ordering bars by value
    "Axis Format Type:" "Auto" How the axis labels its values: "Auto", "Numeric", "Date", "Time", "Date-Time", or "Custom"
    "Format Formula:" Empty The labels' format, for "Custom"
    "Ordering:" "Ascending" on a horizontal axis The direction values run in
    "Auto Min Value:", "Min Value:" "Auto" The lowest value shown. See Setting an axis range
    "Auto Max Value:", "Max Value:" "Auto" The highest value shown
    "Auto Major-Ticks Unit:", "Major-Ticks Unit:" "Auto" The spacing of labeled ticks
    "Auto Minor-Ticks Unit:", "Minor-Ticks Unit:" "Auto" The spacing of small ticks

  4. Select "Close".

  5. Check that the axis shows the change.

A long title on a vertical axis is drawn across the axis rather than along it, and is cut to the axis's width. A long title on a horizontal axis fits.

Setting an axis range

An axis's range is set by switching "Auto Min Value:" and "Auto Max Value:" to "User select", which is available only when "Axis Format Type:" is not "Auto".

  1. Open "Edit Axis" for the axis, as in Editing an axis.
  2. Set "Axis Format Type:" to the type of the axis's values: "Numeric" for numbers, "Date-Time" for dates and times.
  3. Set "Auto Min Value:" and "Auto Max Value:" to "User select".

  4. Enter the range:

    • Numeric: Type the values in "Min Value:" and "Max Value:", such as 0 and 1000.
    • Date-Time: Choose the month, day, and year in the "Min Value:" and "Max Value:" date pickers, and the hour, minute, second, and milliseconds in the boxes below them. The time boxes are cut off below the date: to reach them, scroll the mouse wheel over the date fields, or select the year box and press Tab. Clicking where they show selects the setting below instead.

  5. Select "Close".

  6. Check that the axis runs from the new minimum to the new maximum.

While "Axis Format Type:" is "Auto", "User select" is grayed out and cannot be selected, with no message saying why.

With "Numeric", the axis labels gain thousands separators, such as 1,000.

Stopping the first and last points being cut off

By default, an axis runs exactly from the first value to the last, so the first and last candles, bars, or markers are drawn half outside the plot. Their hidden halves give no hover readout.

To make room, set the axis range slightly wider than the data. For a candlestick of daily prices, set "Axis Format Type:" to "Date-Time" and choose a minimum one day before the first candle and a maximum one day after the last, as in Setting an axis range. Every candle is then drawn in full.

Ordering bars by value

A category axis lists its categories in alphabetical order by default, whatever the order of the datamodel's rows. "Sub-Title Ordering:" "Original" orders them by the layer instead. On a bar chart made in the gallery, that order is the bars' value, smallest first, whatever the order of the rows:

  1. Open "Edit Axis" for the category axis, the horizontal axis of a vertical bar chart.
  2. Set "Sub-Title Ordering:" to "Original". The bars now run from the smallest to the largest.
  3. For the largest first, select "Ordering:" once, so that it reads "Descending".
  4. Select "Close".
  5. Check that the bars run from the largest to the smallest.

"Ordering:" "Descending" has a white label on a white button and is hard to read.

On a horizontal bar chart the category axis is the vertical one, and its "Ordering:" starts at "Descending", which draws the smallest bar at the bottom. Set "Original" only, and the largest bar is at the top.

The order comes from the layer's "Order By:" formula, which the bar editor fills from the bar's value and does not show; it is in the layer's "Advanced" form. Under "Original", an "Order By:" that is a single aggregate orders the bars by its value, smallest first: sum(Qty) as filled, or sum(-Qty) for the largest first. Any other formula, such as a column name or -sum(Qty), leaves the bars in the order the rows arrive, as an empty one does. "Ordering:" "Descending" reverses either order.

Over MCP, a bar chart's "Order By:" is the value column itself, such as Qty, so under "Original" its bars follow the rows: sort them in the datamodel's query, such as SELECT * FROM Trades ORDER BY Qty DESC for the largest first. "Original" is the category axis's "isGroupOrdered": false. On a horizontal bar chart, whose first row is drawn at the bottom, "flip": true on the category axis sets "Ascending" and puts the first row at the top.

Dates on an axis

Dates and times on an axis, in hover text, and in table previews are shown in the user's time zone, not in the zone they were stored in. The default zone is EST5EDT, set by the property ami.default.user.timezone.

So with the default zone, a date stored as midnight UTC is shown the evening before: at 20:00 in summer and 19:00 in winter. On a daily chart, each candle then sits between two day labels. To show such dates on their own day:

  • Store dates at midnight in the users' time zone: not at midnight UTC.
  • Change the user's time zone: Account -> My Settings... opens "User Settings", whose "Time Zone:" field sets it for that user.

This holds with the axis's "Axis Format Type:" on "Auto", which writes the dates in a row beneath the ticks, each under its own day; "Date-Time" labels the axis the same way. On "Auto", the hour ticks still fall at midnight UTC, so with the default zone each day's band runs from 20:00 or 19:00 the evening before, and a point stored at midnight in the users' zone sits near the start of its own day's band. The last day's band can be left without a label. With "Date" or a "Custom" date formula, the ticks are placed from midnight UTC whatever the zone. With the default zone, each tick then falls at 20:00 or 19:00 the evening before, so each date label is a day early, and with ticks 6 hours apart a date can appear twice. Leave a daily axis on "Auto".

In hover text, formatDate with a zone shows a date in that zone instead; see Writing hover text.

What this does not support

  • Deleting an axis that a layer uses: "Delete Highlighted Axis" refuses while any layer is drawn on the axis. Move the layer to another axis first, with its "Horizontal Axis:" or "Vertical Axis:" setting in the layer editor.