Skip to content

Customization

The ORTEX mark, on and off

What the mark looks like without a license, and what a white-label key changes.

The ORTEX mark, on and off@ortex-charts/core
Loading the ortex mark, on and off
What the mark looks like without a license, and what a white-label key changes.
branding.ts
import { clearLicense, createFinancialChart, hasFeature, licenseStatus, setLicenseKey } from "@ortex-charts/financial";

const options = { theme, timeZone: TIME_ZONE, resolution: "1D", volume: false, data: bars };

// Left: the default. The mark is drawn, with its caption while unlicensed.
const marked = createFinancialChart(columns[0].box, { ...options, branding: { visible: true } });
// Right: the same chart asking for the mark to be hidden. Nothing happens
// until a license granting `whitelabel` is installed.
const white = createFinancialChart(columns[1].box, { ...options, branding: { visible: false } });

/**
 * Installing a key. `setLicenseKey` checks the expiry and the domain
 * synchronously and the Ed25519 signature through WebCrypto, then resolves
 * with the final state; every chart on the page repaints itself.
 *
 * The `hostname` option is here only because this demonstration installs
 * ORTEX's own key, which is issued for ortex.com rather than for this page.
 * Your application calls `setLicenseKey(key)` with no options, and the
 * check runs against the domain the page is served from.
 */
async function install(): Promise<string> {
    const state = await setLicenseKey(ORTEX_LICENSE_KEY, { hostname: "charts.ortex.com" });
    // `hasFeature("whitelabel")` is true from here, and both charts have
    // already repainted themselves: the right one without the mark.
    return `License ${state.state}${state.verified ? ", signature verified in the browser" : `: ${state.message}`}`;
}