A live tick stream

import { createFinancialChart, ManualSource, type LiveItem } from "@ortex-charts/financial";
import { parseResolution, ticksToBars, type Bar, type Tick } from "@ortex-charts/math";

// A host builds this from its feed, usually with `websocketSource`:
//     const source = websocketSource<LiveItem>({ url, parse: (raw) => JSON.parse(String(raw)) });
// This page has no market data connection, so the ticks below are simulated
// and pushed by hand into a `ManualSource`, which is the same interface.
const source = new ManualSource<LiveItem>();

const chart = createFinancialChart(el, {
    theme,
    timeZone: TIME_ZONE,
    resolution: RESOLUTION,
    watermark: { text: SYMBOL, visible: true, fontSize: 36 },
    seriesOptions: { priceFormat: { type: "price", precision: 2, minMove: 0.01 }, lastValueVisible: true, priceLineVisible: true },
    timeScale: { barSpacing: 9, rightOffsetPx: 90, followRealtime: true },
    data: history,
});
chart.addIndicator("ema", { length: 9 });

let ticks = 0;
let formed = 0;
// One call subscribes the chart to the source and returns the unsubscribe.
const stop = chart.live(source, {
    resolution: RESOLUTION,
    timeZone: TIME_ZONE,
    onUpdate: (item, appended) => {
        ticks++;
        if (appended) formed++;
        if (ticks % 3 === 0 && "close" in item) {
            status(`${ticks} ticks   last ${item.close.toFixed(2)}   ${formed} new bar${formed === 1 ? "" : "s"} since the stream opened`);
        }
    },
});