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

Bar Chart of Totals by Category

Known issues

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

This walkthrough draws one bar per symbol, answering "Which symbol traded the most?"

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
    CREATE PUBLIC TABLE ChartDemoTotals (Symbol String, Qty Long);
INSERT INTO ChartDemoTotals VALUES ("MSFT", 225), ("IBM", 320), ("AAPL", 460), ("JPM", 750), ("NVDA", 80);
SELECT * FROM ChartDemoTotals;

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

"V Bar Chart" and "H Bar Chart" take the same fields; pick "H Bar Chart" for long category names. On a horizontal bar chart, stage 3 needs "Original" only, which puts the largest bar at the top; see Ordering bars by value.

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 ChartDemoTotals, then "Next >>".
  4. Select "Test (alt+enter)", then "Next >>".
  5. Select the "Cartesian" tab, then the "V Bar Chart" tile.

  6. Set the fields below the tiles:

    Field Value
    "Category:" Symbol
    "Value:" sum(Qty)
    "Color by:" Leave empty

  7. Select "Finish".

  8. Check that the window shows 5 bars, AAPL, IBM, JPM, MSFT, and NVDA, with JPM the tallest at 750.

3. Put the largest first

The bars are in alphabetical order. "Original" orders them by their value instead, smallest first, whatever the order of the rows, and "Ordering:" "Descending" reverses that. See Ordering bars by value.

  1. Open "Edit Axis" on the category axis.
  2. Set "Sub-Title Ordering:" to "Original". The bars now run NVDA, MSFT, IBM, AAPL, JPM.
  3. Select "Ordering:" once, so that it reads "Descending".
  4. Select "Close".
  5. Check that the bars run JPM, AAPL, IBM, MSFT, NVDA.

Result

5 bars, one per symbol, each in its own color, from JPM at 750 down to NVDA at 80.

The finished "V Bar Chart" chart: 5 bars, one per symbol, each in its own color, from JPM at 750 down to NVDA at 80

The chart's own PNG export, from AmiScript toImagePng; see Chart type walkthroughs.

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 layer reports Rows 5, "5 groups", and an empty Problem.

With your own data

The chart needs one row per category: a text column for "Category:" and a number for "Value:". In stage 2, select the "USER" tile of your table in place of ChartDemoTotals, and map your columns to the fields in stage 2's field table. Stage 2's check quotes the example data; on yours, check the same features against your own values. To filter rows, or to total raw rows first, see Using your own data.

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 ChartDemoTotals:

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

  2. Create the chart:

    1
    {"windowName": "ChartDemoBar", "datamodelId": "ChartDemoTotals", "dmTable": "ChartDemoTotals", "chartType": "bar", "xField": "Symbol", "yField": "Qty", "title": "ChartDemoBar", "logScale": ""}

  3. Run the datamodel again with web_execute op=executeDatamodel, dmName ChartDemoTotals. 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. Its bars are in alphabetical order. To order them as the rows arrive, export the chart with web_console op=exportPanel, add "isGroupOrdered": false to the bottom axis, and pass the result to web_execute op=updatePanel. Use "chartType": "hbar" for horizontal bars; the category axis is then the left one, and the first row is drawn at the bottom.

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, ChartDemoTotals, and select "Delete Datamodel", then "Yes". If that name was taken when stage 2 ran, the gallery added a number to it, as in ChartDemoTotals1.
  3. Run DROP TABLE ChartDemoTotals; in the AMIDB Shell Tool.
  4. Check that SELECT * FROM ChartDemoTotals; reports Unknown table: ChartDemoTotals.

Over MCP, delete the chart with web_danger op=deletePanel, then the datamodel with op=deleteDatamodel, dmName ChartDemoTotals, 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.