Building Custom GFX Tables in AmiBroker

Sometimes, as traders, we want certain pieces of information—like indicators, price stats, or signals—to be displayed neatly on our charts. AmiBroker’s Graphics (GFX) library lets us draw shapes, text, and tables on the chart, offering complete freedom over layout and design. The code below demonstrates how to create a simple table that shows price, volume, RSI, ATR, and moving averages.

Why Use a GFX Table?

• Centralize Key Info: Instead of scanning multiple indicators or separate panes, you can place your important data in a concise, easy-to-read table.
• Customize Aesthetics: You control colors, fonts, cell size, and position—meaning you can make it match your chart style or color scheme.
• Highlight What Matters: Show only the stats or signals you care about (e.g., RSI, ATR, MAs, or custom indicators).

Key Parts of the Example

1. User-Defined Parameters:
   • cellHeight, cellWidth, startX, startY are user-adjustable. This means you can move and resize the table to fit your chart layout or personal preference.
2. TableCell Function:
   • This function handles the drawing of individual cells (background + text). You just feed it the text you want, which column and row to place it in, and your color choices.
   • Each cell is drawn with a background color and a border, then the text is placed in the center.
3. Indicator Calculations:
   • The script calculates SMA, EMA, RSI, ATR, and ROC. You can replace these with any custom formulas you like—perhaps a custom oscillator, volatility measure, or pivot point calculation.
4. Table Headers and Rows:
   • The script uses TableCell multiple times to create headers (like “Open,” “Close,” “Volume,” etc.) and then place the corresponding indicator or price data beneath each header.
   • You can expand this concept to add more rows or columns—simply follow the same pattern of specifying column and row numbers.
5. Final Placement:
   • The table is drawn on the chart using AmiBroker’s Gfx functions. The end result is a neat, two-part table: one for price-related stats and one for moving averages.

How to Make It Your Own

• Add/Remove Indicators: Swap out RSI for your favorite momentum indicator, or add a new row for something like the Stochastics or Bollinger Band values.
• Change Colors/Style: Experiment with ParamColor or hard-code your favorite colors. Adjust cellHeight and cellWidth for bigger or smaller cells.
• Position the Table Anywhere: Tweak startX and startY to move the table. This is especially helpful if your chart is crowded or you use multiple monitors.

//Rajandran R - Creator of OpenAlgo
//website - openalgo.in / marketcalls.in
//GFX Table v1.0
//Date - 17/02/2025

////////////////////////////////////////////////////////////////////////////////
// This AFL code demonstrates how to create and position a GFX table on a chart
// using a custom function called TableCell. 
//
// How to Use TableCell:
//
//    TableCell( text, col, row, bgColor, textColor )
//
//    text     : The string or numeric value to display in the cell.
//    col      : Which column of the table this cell belongs to (starting at 1).
//    row      : Which row of the table this cell belongs to (starting at 1).
//    bgColor  : Background color of the cell.
//    textColor: Text color of the cell.
//
// You can control the overall table layout and position with these parameters:
//    cellWidth, cellHeight : Adjust the size of each cell.
//    startX, startY        : Specify where the table starts on the chart.
//
// Usage Example:
//    // Places the text "Hello World" in the first column, first row
//    // with a black background and white text.
//    TableCell("Hello World", 1, 1, colorBlack, colorWhite);
//
// To add new rows, increment the row parameter. To add columns, increment the
// col parameter. You can also modify the Gfx calls inside TableCell to draw
// borders, backgrounds, or other design elements to match your preferences.
////////////////////////////////////////////////////////////////////////////////

_SECTION_BEGIN("GFX Tables");

// User-configurable Table Settings
cellHeight = Param("Cell Height", 40, 10, 50, 1);
cellWidth = Param("Cell Width", 100, 50, 200, 1);

startX = Param("Start X Position", 50, 0, 1200, 1);
startY = Param("Start Y Position", 600, 0, 1200, 1);

// Table Border and Fill Color
tableBorderColor = ParamColor("Table Border Color", colorBlue);
tableFillColor = ParamColor("Table Fill Color", colorBlack);

// Function to Draw a Table Cell (Background + Text)
function TableCell(text, col, row, bgColor, textColor)
{
    x1 = startX + (col - 1) * cellWidth;
    y1 = startY + (row - 1) * cellHeight;
    x2 = x1 + cellWidth;
    y2 = y1 + cellHeight;
    textX = x1 + (cellWidth / 2) - 10;
    textY = y1 + (cellHeight / 2) - 5;

    // Draw Cell with Background and Border
    GfxSelectPen(tableBorderColor, 1);
    GfxSelectSolidBrush(bgColor);
    GfxRectangle(x1, y1, x2, y2);

    // Set Text Color and Background
    GfxSetBkColor(bgColor);
    GfxSetTextAlign(6);
    GfxSetTextColor(textColor);
    GfxTextOut(text, textX, textY);
}

// Indicator Calculations
sma1 = MA(Close, 50);
sma2 = MA(Close, 100);
sma3 = MA(Close, 200);
ema1 = EMA(Close, 50);
ema2 = EMA(Close, 100);
ema3 = EMA(Close, 200);
rsiValue = RSI(14);
atrValue = ATR(14);
rocValue = ROC(Close, 1);

// Draw Table - Row1
TableCell("Open", 1, 1, colorBlue, colorWhite);
TableCell("Close", 2, 1, colorBlue, colorWhite);
TableCell("Change %", 3, 1, colorBlue, colorWhite);
TableCell("RSI", 4, 1, colorBlue, colorWhite);
TableCell("ATR", 5, 1, colorBlue, colorWhite);
TableCell("Volume", 6, 1, colorBlue, colorWhite);

// Draw Table - Row2
TableCell(StrFormat("%.2f", Open), 1, 2, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", Close), 2, 2, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f%%", rocValue), 3, 2, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", rsiValue), 4, 2, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", atrValue), 5, 2, tableFillColor, colorWhite);
TableCell(StrFormat("%.0f", Volume), 6, 2, tableFillColor, colorWhite);

// Draw Table - Row3
TableCell("SMA 50", 1, 3, colorGrey40, colorWhite);
TableCell("SMA 100", 2, 3, colorGrey40, colorWhite);
TableCell("SMA 200", 3, 3, colorGrey40, colorWhite);
TableCell("EMA 50", 4, 3, colorGrey40, colorWhite);
TableCell("EMA 100", 5, 3, colorGrey40, colorWhite);
TableCell("EMA 200", 6, 3, colorGrey40, colorWhite);

// Draw Table - Row4
TableCell(StrFormat("%.2f", sma1), 1, 4, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", sma2), 2, 4, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", sma3), 3, 4, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", ema1), 4, 4, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", ema2), 5, 4, tableFillColor, colorWhite);
TableCell(StrFormat("%.2f", ema3), 6, 4, tableFillColor, colorWhite);

_SECTION_END();


_SECTION_BEGIN("Candle with X-Axis");

//Enable X-Axis
SetChartOptions(0, chartShowArrows | chartShowDates);

_N(Title = StrFormat("{{NAME}} - {{INTERVAL}} {{DATE}} Open %g, Hi %g, Lo %g, Close %g (%.1f%%) {{VALUES}}", O, H, L, C, SelectedValue( ROC( C, 1 ) ) ));

//Plot Candles
Plot(Close,"Candles",colorDefault,styleCandle);

_SECTION_END();

Practical Tips

• Ensure Readability: Use contrasting colors for text and background so the data is easy to read.
• Check Performance: If you add many columns or heavy calculations, it can slow down chart rendering. Keep an eye on performance.
• Stay Organized: Label your headers clearly, especially if you’re adding many custom indicators.

Closing Thoughts

AmiBroker’s GFX functionality empowers you to create tables tailored to your trading workflow. By displaying your favorite indicators, price stats, or signals in a well-organized layout, you can make quicker, more informed decisions. Feel free to adapt the code snippet by adding your own rows, columns, and calculations. With a few tweaks, you’ll have a custom on-chart dashboard perfectly aligned with your trading style.