Function createChart

examples/worker-rendering/main.ts:369–417

(
  mode: RenderMode,
  dataType: DataType,
  data: DataPoint[] | OHLCDataPoint[]
)

// ============================================================================

async function createChart(
  mode: RenderMode,
  dataType: DataType,
  data: DataPoint[] | OHLCDataPoint[]
): Promise<ChartGPUInstance> {
  const container = document.getElementById('chart');
  if (!container) {
    throw new Error('Chart container not found');
  }

  const options: ChartGPUOptions = {
    grid: { left: 60, right: 24, top: 24, bottom: 60 }, // Increased bottom for slider
    xAxis: { type: 'value', name: 'Index' },
    yAxis: { type: 'value', name: 'Value' },
    palette: ['#06b6d4', '#6366f1', '#10b981', '#f59e0b', '#ef4444'],
    animation: false, // Disable for performance
    dataZoom: [
      {
        type: 'inside',
        xAxisIndex: 0,
        start: 0,
        end: 100,
      },
      {
        type: 'slider',
        xAxisIndex: 0,
        start: 0,
        end: 100,
      },
    ],
    series: [
      {
        type: dataType === 'candlestick' ? 'candlestick' : dataType,
        name: `${dataType} series`,
        data: data as any,
        color: '#06b6d4',
        lineStyle: dataType === 'line' ? { width: 1.5, opacity: 0.9 } : undefined,
        sampling: 'lttb',
        samplingThreshold: 5000,
      } as any,
    ],
  };

  if (mode === 'worker') {
    return await ChartGPU.createInWorker(container, options);
  } else {
    return await ChartGPU.create(container, options);
  }
}

function disposeChart(): void {
  // Clean up performance subscription