Skip to main content

Templates

ChartTemplate is a reusable preset. Applying one changes chart content while keeping the current saved chart layout identity, active workspace tab, and separate drawing bucket. Use a chart layout when the user expects to open one specific workspace instead.

Choose a template kind​

KindStoresIdentityTypical use
indicatorIndicators, comparisons, display settings, and optional symbol or intervaltemplateIdApply one analysis stack to another chart
drawingA drawing snapshot, normally scoped to one tooltemplateTool + templateIdReuse a risk box or annotation preset
chartA ChartLayout inside the templatetemplateIdApply a house chart configuration

All kinds use the same list, save, load, delete, apply, import, and export surface. Storage scope is adapter-defined; it is per user only when your adapter or REST configuration makes it so.

Save and apply an indicator template​

indicatorTemplate.ts
import type { ChartApi } from '@tradescript/pro/sdk';

declare const chart: ChartApi;

const created = chart.createIndicatorTemplate({
  id: 'momentum-stack',
  name: 'Momentum stack',
  saveSymbol: false,
  saveInterval: false,
});

await chart.saveTemplate({ template: created });

const summaries = await chart.listTemplates({ kind: 'indicator' });
const stored = await chart.loadTemplate({
  kind: 'indicator',
  templateId: 'momentum-stack',
});

if (stored) {
  await chart.applyTemplate(stored);
}

await chart.deleteTemplate({
  kind: 'indicator',
  templateId: 'momentum-stack',
});

console.log(summaries.length);

Set saveSymbol or saveInterval only when applying the template should switch that value. Otherwise the saved indicator stack applies to the current instrument and interval.

loadTemplate() resolves null when the identity does not exist. Saving the same identity overwrites it; the built-in UI asks before overwrite. The adapter has no template revision or compare-and-swap contract.

Template application is one undo transaction. Undo restores the chart state changed by the application rather than removing each indicator or drawing individually.

Keep drawing-tool identity exact​

A drawing template must contain drawings that belong to its declared tool. Filter the chart snapshot before saving a tool-scoped template:

drawingTemplate.ts
import type { ChartApi, ChartTemplate } from '@tradescript/pro/sdk';

declare const chart: ChartApi;

const template: ChartTemplate = {
  id: 'risk-box',
  kind: 'drawing',
  version: 1,
  name: 'Risk box',
  drawings: chart.getDrawings().filter(({ type }) => type === 'rectangle'),
  metadata: { tool: 'rectangle' },
};

await chart.saveTemplate({
  template,
  templateTool: 'rectangle',
});

const stored = await chart.loadTemplate({
  kind: 'drawing',
  templateId: 'risk-box',
  templateTool: 'rectangle',
});

if (stored) {
  await chart.applyTemplate(stored, { drawingMode: 'replace-tool' });
}

Use the same templateTool for every stored drawing-template operation so the template keeps one stable identity. See the REST chart storage adapter for its exact query contract.

Drawing application modes are explicit:

  • replace-tool replaces only drawings of the selected tool;
  • append adds drawings with regenerated ids;
  • replace replaces the complete drawing set.

The built-in UI uses replace-tool for tool-scoped templates. Replacing an all template requires confirmation.

Save a chart template​

await chart.saveTemplate({
  template: {
    id: 'house-default',
    kind: 'chart',
    version: 1,
    name: 'House default',
    layout: chart.getLayout('house-default'),
  },
});

Applying this template changes chart configuration but does not navigate to a saved chart layout or replace the workspace controller's logical and backend ids.

Configure the built-in UI​

The full template lifecycle is available by default when the adapter implements all four methods. Narrow the visible kinds with features.templates:

features: {
  templates: {
    toolbar: true,
    chart: true,
    indicator: true,
    drawing: false,
    importExport: true,
  },
}

The feature object hides supported rows; it does not add a missing adapter method. See Storage UI for the complete visibility rules.

Import and export JSON​

const json = chart.exportTemplate(template);
const imported = chart.importTemplate(json);
await chart.applyTemplate(imported);

Import and export do not call the storage adapter. Validate untrusted files and let importTemplate reject unsupported public shapes before applying them.

Next steps​