Getting started

Introduction

Unlike traditional platforms requiring heavy compile times, the BacktestX script engine interprets standard JavaScript immediately. The engine injects a execution context variable ctx containing raw bar feeds, coordinate conversion projections, and 23+ pre-bundled indicators.

Any script you apply runs directly on the HTML5 2D canvas, allowing you to build indicators like moving averages, render custom buy/sell tags, highlight bands, or generate custom trade alerts.

Opening the Editor

To open the Script Editor workspace:

1. Launch the BacktestX Trading Terminal.
2. In the bottom toolbar area (below the main chart grid), locate and click the "Script Editor" button.
3. The split-screen editor panel will slide open, displaying the code editor on the left, an action toolbar, and the interactive mockup chart console.

Interface Layout

The workspace consists of four primary components:

Your First Script

Let's write a simple script that overlays a 20-period Simple Moving Average (SMA) line over the price chart:

// 1. Retrieve bar and viewport data
const bars = ctx.bars;
const bounds = ctx.bounds;
if (!bars || bars.length < 20) return;

// 2. Compute indicator feed
const sma20 = ctx.sma(bars.map(b => b.close), 20);

// 3. Setup canvas options
ctx.beginPath();
ctx.strokeStyle = '#2962ff';
ctx.lineWidth = 2.5;

// 4. Render SMA line
let started = false;
for (let i = Math.max(0, Math.floor(bounds.startIndex) - 1); i <= Math.ceil(bounds.endIndex) + 1; i++) {
  if (i >= bars.length || isNaN(sma20[i])) continue;
  const x = ctx.barToX(i);
  const y = ctx.priceToY(sma20[i]);
  if (!started) {
    ctx.moveTo(x, y);
    started = true;
  } else {
    ctx.lineTo(x, y);
  }
}
ctx.stroke();

Standard Workflow