Skip to content
Web > Charts

Quickstart: Chart a Table

Known issues

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

This guide builds a bar chart of quantity by symbol from a table in the Center, using the visualization gallery, and shows the values when pointing at each bar.

Prerequisites

  • A running 3forge instance, and a sign-in to its Web UI with permission to edit dashboards.
  • Editor mode. Click once on the screen, then press Ctrl+d, or select the person icon at the top right of the screen, whose tooltip reads "Switch to Editor mode". In Editor mode the icon turns into a green wrench, the page shows a grid, and a "Dashboard" menu appears in the top bar. Press Ctrl+d again to return to the view users see.

1. Create a table in the Center

The chart reads a table in the Center, so create one first. Creating the table is covered in more detail in the datamodels quickstart.

  1. Select Dashboard -> AMIDB Shell Tool.... A window titled "AMIDB Shell Tool" opens.

  2. In the input area at the top of the window, enter the following, then select "Run (alt+⏎)":

    1
2
3
    CREATE PUBLIC TABLE ChartQuickstartTrades (Symbol String, Qty Long);
INSERT INTO ChartQuickstartTrades VALUES ("MSFT", 225), ("IBM", 320), ("AAPL", 460), ("JPM", 750), ("NVDA", 80);
SELECT * FROM ChartQuickstartTrades;

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

Close the AMIDB Shell Tool window before going on.

Create the table with PUBLIC. A table created without it is not visible to the chart's datamodel.

2. Open a window for the chart

A chart is a panel, and a panel sits in a window. A new window starts with a blank panel.

  1. Select Windows -> New Window.
  2. Check that a window titled "Window" opened, holding one blank panel labeled Blank1.

3. Choose the table

The gallery starts by asking where the data comes from. Choosing a table creates the datamodel that reads it.

  1. Select the edit button on Blank1, then select "Create Table / Visualization / Form". A window titled "AMI Panel" opens on the "AMI Data Modeler" step.
  2. In the tree on the left, under "Datasources", select "AMI (__AMI)", which is the Center. Then select "Next >>".
  3. The "AMI Table Chooser" step lists the Center's tables as tiles, each marked "SYSTEM" or "USER". Select the "USER" tile ChartQuickstartTrades. A preview of its first 10 rows appears below.

  4. Select "Next >>". A datamodel named ChartQuickstartTrades is created, and its editor opens with the query already filled in:

    1
    CREATE TABLE ChartQuickstartTrades AS EXECUTE SELECT * FROM ChartQuickstartTrades WHERE ${WHERE};

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

  6. Check that the "Schema" tab lists ChartQuickstartTrades with "String Symbol" and "Long Qty".

The test is required. Selecting "Next >>" without it asks "Run a test now?", and "Skip Test & Continue" stops with "Datamodel must produce at least one table in order to add a vizualization".

4. Pick the bar chart

The gallery groups chart types into tabs, and each tile previews the chart from the table as soon as it is selected.

  1. Select "Next >>". The gallery opens with the tabs "Grid", "Cartesian", "Radial", "Flow", "3D", "HTML", and "Plugins", and a "LIVE PREVIEW" area on the right.
  2. Select the "Cartesian" tab, then the "V Bar Chart" tile.

  3. Check the field mapping below the tiles, which is filled in from the table's columns:

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

    The live preview shows 5 bars.

  4. Select "Finish".

  5. Check that the window now shows a bar chart with 5 bars labeled AAPL, IBM, JPM, MSFT, and NVDA, with JPM the tallest.

Result

Press Ctrl+d to leave Editor mode and see the chart as users see it:

  • 5 bars, one per symbol, in alphabetical order, each in its own color.
  • Pointing at a bar shows its symbol and its total quantity, written with 3 decimals.

The bars are in alphabetical order whatever the table's order. To put the largest first, see Ordering bars by value.

Keeping the result

The chart and its datamodel are part of the open layout until it is saved. Select File -> Save As -> My Layouts, enter a file name, and select "Save".

To remove the example table instead, run DROP TABLE ChartQuickstartTrades; in the AMIDB Shell Tool.

Next steps

  • Chart types: every other tile, and which columns each one needs.
  • Layers: change the fields a chart draws from, its hover text, and its colors.
  • Charts that update live: redraw the chart when rows are added to the table.