Skip to content
Web > Charts > Chart Type Walkthroughs > Cartesian

Stacked Area Chart of Volume by Desk

Known issues

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

This walkthrough stacks each desk's daily volume into bands, answering "How did the mix of volume change through the week?"

Prerequisites

  • Editor mode: click once on the screen, then press Ctrl+d. The AMIDB Shell Tool and the gallery are used as in the quickstart.
  • Data: the example data that stage 1 creates. To use a table of your own instead, see With your own data.

1. Create the example data

The chart reads a table in the Center, so create the table first.

  1. Select Dashboard -> AMIDB Shell Tool....

  2. Run:

     1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
    CREATE PUBLIC TABLE ChartDemoMix (Day UTC, Desk String, Bottom Double, Top Double);
INSERT INTO ChartDemoMix VALUES
 (parseDate("2026-10-05", "yyyy-MM-dd", "EST5EDT"), "Equities", 0, 40),
 (parseDate("2026-10-05", "yyyy-MM-dd", "EST5EDT"), "Rates", 40, 65),
 (parseDate("2026-10-05", "yyyy-MM-dd", "EST5EDT"), "FX", 65, 80),
 (parseDate("2026-10-06", "yyyy-MM-dd", "EST5EDT"), "Equities", 0, 45),
 (parseDate("2026-10-06", "yyyy-MM-dd", "EST5EDT"), "Rates", 45, 68),
 (parseDate("2026-10-06", "yyyy-MM-dd", "EST5EDT"), "FX", 68, 90),
 (parseDate("2026-10-07", "yyyy-MM-dd", "EST5EDT"), "Equities", 0, 38),
 (parseDate("2026-10-07", "yyyy-MM-dd", "EST5EDT"), "Rates", 38, 70),
 (parseDate("2026-10-07", "yyyy-MM-dd", "EST5EDT"), "FX", 70, 85),
 (parseDate("2026-10-08", "yyyy-MM-dd", "EST5EDT"), "Equities", 0, 50),
 (parseDate("2026-10-08", "yyyy-MM-dd", "EST5EDT"), "Rates", 50, 72),
 (parseDate("2026-10-08", "yyyy-MM-dd", "EST5EDT"), "FX", 72, 95),
 (parseDate("2026-10-09", "yyyy-MM-dd", "EST5EDT"), "Equities", 0, 47),
 (parseDate("2026-10-09", "yyyy-MM-dd", "EST5EDT"), "Rates", 47, 77),
 (parseDate("2026-10-09", "yyyy-MM-dd", "EST5EDT"), "FX", 77, 92);
SELECT * FROM ChartDemoMix;

  3. Check that the lower pane shows the 15 rows.

The dates are stored at midnight New York time, the default user time zone, so each one falls on its own day. See Dates on an axis.

The template draws each band from "Band Bottom:" to "Band Top:" and computes nothing, so each row already holds its band's edges: each desk's bottom is the top of the desk below it.

2. Create the chart

The gallery creates a datamodel that reads the table, then places the chart.

  1. Select Windows -> New Window, then the edit button on Blank1, then "Create Table / Visualization / Form".
  2. Select "AMI (__AMI)", then "Next >>".
  3. Select the "USER" tile ChartDemoMix, then "Next >>".
  4. Select "Test (alt+enter)", then "Next >>".
  5. Select the "Cartesian" tab, then the "Stacked Area" tile.

  6. Set the fields below the tiles:

    Field Value
    "X Axis:" Day
    "Series:" Desk
    "Band Bottom:" Bottom
    "Band Top:" Top

  7. Select "Finish".

  8. Check that the window shows 3 stacked bands over Oct 5 to Oct 9, the top one ending between 80 and 95.

Result

3 bands, Equities at the bottom and FX on top, with a total between 80 and 95.

To check without looking, read the render stats: session.getDevTools().getAllRenderStats() in the AMIDB Shell Tool, with "Run on this web session" selected (see Running a script), or web_debug op=panelRenderStats over MCP. The "Bands" layer reports Rows 15, "3 groups", and an empty Problem.

With your own data

If your table holds one value per series per x value rather than each band's bottom and top, shape the rows in the datamodel's query. To try it on example rows, run this in the AMIDB Shell Tool first:

1
2
3
4
5
6
7
CREATE PUBLIC TABLE ChartDemoDeskVolume (Day UTC, Desk String, Pos Long, Volume Double);
INSERT INTO ChartDemoDeskVolume VALUES
 (parseDate("2026-10-05", "yyyy-MM-dd", "EST5EDT"), "Equities", 1, 40), (parseDate("2026-10-05", "yyyy-MM-dd", "EST5EDT"), "Rates", 2, 25), (parseDate("2026-10-05", "yyyy-MM-dd", "EST5EDT"), "FX", 3, 15),
 (parseDate("2026-10-06", "yyyy-MM-dd", "EST5EDT"), "Equities", 1, 45), (parseDate("2026-10-06", "yyyy-MM-dd", "EST5EDT"), "Rates", 2, 23), (parseDate("2026-10-06", "yyyy-MM-dd", "EST5EDT"), "FX", 3, 22),
 (parseDate("2026-10-07", "yyyy-MM-dd", "EST5EDT"), "Equities", 1, 38), (parseDate("2026-10-07", "yyyy-MM-dd", "EST5EDT"), "Rates", 2, 32), (parseDate("2026-10-07", "yyyy-MM-dd", "EST5EDT"), "FX", 3, 15),
 (parseDate("2026-10-08", "yyyy-MM-dd", "EST5EDT"), "Equities", 1, 50), (parseDate("2026-10-08", "yyyy-MM-dd", "EST5EDT"), "Rates", 2, 22), (parseDate("2026-10-08", "yyyy-MM-dd", "EST5EDT"), "FX", 3, 23),
 (parseDate("2026-10-09", "yyyy-MM-dd", "EST5EDT"), "Equities", 1, 47), (parseDate("2026-10-09", "yyyy-MM-dd", "EST5EDT"), "Rates", 2, 30), (parseDate("2026-10-09", "yyyy-MM-dd", "EST5EDT"), "FX", 3, 15);

Remove it afterwards with DROP TABLE ChartDemoDeskVolume;.

  1. Follow stage 2 with the "USER" tile ChartDemoDeskVolume, or the one for your own table, in place of ChartDemoMix.

  2. When the gallery shows the datamodel's query, replace the query with:

    1
2
3
4
5
6
7
    {
  CREATE TABLE Raw AS EXECUTE SELECT * FROM ChartDemoDeskVolume WHERE ${WHERE};
  CREATE TABLE Stacked AS PREPARE Day, Desk, Volume, stack(Volume) AS Top FROM Raw ORDER BY Pos PARTITION BY Day;
  CREATE TABLE ChartDemoMix AS SELECT Day, Desk, Top - Volume AS Bottom, Top FROM Stacked;
  DROP TABLE Raw;
  DROP TABLE Stacked;
}

  3. Select "Test (alt+enter)".

  4. Check that the "Tables" tab shows ChartDemoMix alone, with the same 15 rows as the example table in stage 1.

Then continue with stage 2: the fields are the same, and any later stages apply as written. To do this over MCP, put the same statements in the onProcess of the datamodel that step 1 of "Over MCP" imports, with USE ds="AMI" before each EXECUTE.

stack(Volume) is a running total within each day (PARTITION BY Day), taken in the order of Pos, so the series with Pos 1 is at the bottom.

Over MCP

An agent builds the same chart from the same table. Connecting an agent is covered in the AI section; the tools are on Building charts over MCP.

  1. Create the datamodel with web_execute op=importDatamodel and this dmJson, then run it once with op=initDatamodelSchema and dmName ChartDemoMix:

    1
    {"id": "ChartDemoMix", "queryMode": "startup", "callbacks": [{"name": "onProcess", "amiscript": ["{ CREATE TABLE ChartDemoMix AS USE ds=\"AMI\" EXECUTE SELECT * FROM ChartDemoMix; }"]}]}

  2. Create the chart:

    1
    {"windowName": "ChartDemoStackedArea", "templateKey": "tplStackedArea", "datamodelId": "ChartDemoMix", "dmTable": "ChartDemoMix", "title": "ChartDemoStackedArea", "bindings": "{\"XAX\": \"Day\", \"SER\": \"Desk\", \"BOT\": \"Bottom\", \"TOP\": \"Top\"}"}

  3. Run the datamodel again with web_execute op=executeDatamodel, dmName ChartDemoMix. A chart created over MCP can stay empty until its datamodel runs again, with its axes at 0-100.

  4. Confirm that every layer reports the rows above and an empty Problem: run web_debug op=panelRenderStats.

The call is web_create_chart_from_template.

Removing the example

Remove the chart, then its datamodel, then the table, so that the next walkthrough can reuse the names:

  1. Close the chart's window with its close button, and select "Delete" when asked whether to delete the panel.
  2. Select Dashboard -> Data Modeler..., expand "Datamodels", right-click the chart's datamodel, ChartDemoMix, and select "Delete Datamodel", then "Yes". If that name was taken when stage 2 ran, the gallery added a number to it, as in ChartDemoMix1.
  3. Run DROP TABLE ChartDemoMix; in the AMIDB Shell Tool.
  4. Check that SELECT * FROM ChartDemoMix; reports Unknown table: ChartDemoMix.

Over MCP, delete the chart with web_danger op=deletePanel, then the datamodel with op=deleteDatamodel, dmName ChartDemoMix, and drop the table as in step 3. deleteDatamodel refuses a datamodel that has been committed; delete that one in the Data Modeler as in step 2. See Removing an agent's chart.