Function createChartGPU

src/ChartGPU.ts:449–1475

(
  container: HTMLElement,
  options: ChartGPUOptions
)

};

export async function createChartGPU(
  container: HTMLElement,
  options: ChartGPUOptions
): Promise<ChartGPUInstance> {
  // Check WebGPU support before creating canvas or any resources
  const supportCheck = await checkWebGPUSupport();
  if (!supportCheck.supported) {
    const reason = supportCheck.reason || 'Unknown reason';
    throw new Error(
      `ChartGPU: WebGPU is not available.\n` +
      `Reason: ${reason}\n` +
      `Browser support: Chrome/Edge 113+, Safari 18+, Firefox not yet supported.\n` +
      `Resources:\n` +
      `  - MDN WebGPU API: https://developer.mozilla.org/en-US/docs/Web/API/WebGPU_API\n` +
      `  - Browser compatibility: https://caniuse.com/webgpu\n` +
      `  - WebGPU specification: https://www.w3.org/TR/webgpu/\n` +
      `  - Check your system: https://webgpureport.org/`
    );
  }

  const canvas = document.createElement('canvas');

  // Ensure the canvas participates in layout and can size via the container.
  canvas.style.display = 'block';
  canvas.style.width = '100%';
  canvas.style.height = '100%';

  // Append before awaiting so it appears immediately and has measurable size.
  container.appendChild(canvas);

  let disposed = false;
  let gpuContext: GPUContext | null = null;
  let coordinator: RenderCoordinator | null = null;
  let coordinatorTargetFormat: GPUTextureFormat | null = null;
  let unsubscribeCoordinatorInteractionXChange: (() => void) | null = null;

  let dataZoomSliderHost: HTMLDivElement | null = null;
  let dataZoomSlider: DataZoomSlider | null = null;

  let currentOptions: ChartGPUOptions = options;
  let resolvedOptions: ResolvedChartGPUOptions = resolveOptionsForChart(currentOptions);

  // Chart-owned runtime series store for hit-testing only (cartesian only).
  // - `runtimeRawDataByIndex[i]` is a mutable array used to reflect streaming appends.
  // - `runtimeRawBoundsByIndex[i]` is incrementally updated to keep scale/bounds derivation cheap.
  let runtimeRawDataByIndex: Array<DataPoint[] | OHLCDataPoint[]> = new Array(resolvedOptions.series.length).fill(null).map(() => []);
  let runtimeRawBoundsByIndex: Array<Bounds | null> = new Array(resolvedOptions.series.length).fill(null);
  let runtimeHitTestSeriesCache: ResolvedChartGPUOptions['series'] | null = null;
  let runtimeHitTestSeriesVersion = 0;

  const initRuntimeHitTestStoreFromResolvedOptions = (): void => {
    runtimeRawDataByIndex = new Array(resolvedOptions.series.length).fill(null).map(() => []);
    runtimeRawBoundsByIndex = new Array(resolvedOptions.series.length).fill(null);
    runtimeHitTestSeriesCache = null;
    runtimeHitTestSeriesVersion++;

    for (let i = 0; i < resolvedOptions.series.length; i++) {
      const s = resolvedOptions.series[i]!;