Export & Media Utilities
Extract images, video, and raw data from your charts.
High-Resolution Snapshots (PNG / JPEG / WebP / SVG)
Capture the WebGL plot area and all 2D overlays (axes, annotations, legends). Supports SVG vector export and up to 8K raster resolution.
Resolution
Format & Quality
Options
Single-chart code
typescript
import { createChart } from 'velo-plot';
import { PluginSnapshot } from 'velo-plot/plugins/snapshot';
const chart = createChart({ container });
chart.use(PluginSnapshot());
// Raster
await chart.snapshot.downloadSnapshot({ format: 'png', resolution: '4k' });
// Vector SVG
const svg = await chart.snapshot.takeSnapshot({ format: 'svg' });
// or synchronously:
const svgSync = chart.exportSVG();Multi-Pane Stack Export
Export an entire stacked layout (price + volume + RSI, or horizontal side-by-side panes) as one composite image — PNG, JPEG, WebP, or SVG:
typescript
const png = await stack.exportImage({ format: 'png', resolution: '4k' });
const svg = stack.exportSVG({ includeDividers: true });
await stack.snapshot({
format: 'jpeg',
download: true,
fileName: 'trading-stack',
includeDividers: true,
});Try it on the Multi-Pane Stack example — use the Export PNG / JPEG / WebP / SVG buttons in the toolbar.
Per-pane live vector: chart: { renderer: 'svg' } in each pane config. See SVG Charts.
Native Video Recording
Record active chart animations directly from the browser buffer.
Native Video Recording
Multi-Format Data Export
Extract raw data for external analysis in CSV, JSON, and more.
API Reference Summary
typescript
import { PluginSnapshot } from 'velo-plot/plugins/snapshot';
import { PluginVideoRecorder } from 'velo-plot/plugins/video-recorder';
import { PluginDataExport } from 'velo-plot/plugins/data-export';
import { createStackedChart } from 'velo-plot/trading';
// Single chart — raster + SVG
chart.use(PluginSnapshot());
await chart.snapshot.takeSnapshot({ format: 'svg' });
await chart.snapshot.downloadSnapshot({ format: 'webp', resolution: '2k' });
chart.exportSVG(); // built-in vector export
// Multi-pane stack — composite raster
const stack = createStackedChart({ container, panes: [...] });
await stack.exportImage({ format: 'png', resolution: '4k' });
// Video
chart.use(PluginVideoRecorder());
chart.videoRecorder.start();
// Raw data
chart.use(PluginDataExport());
chart.exportCSV();See also: Image & Vector Export API · Export plugins · Data export