# Export

> Export: anatomy, keyboard behavior, state, and theming in Askr.

Source: [https://askrjs.com/docs/charts/export](https://askrjs.com/docs/charts/export)

Status: stable. Packages: @askrjs/askr.

**Published packages are authoritative.** Examples may lag behind a published contract. When guidance differs, verify the exports and TypeScript declarations in your installed package, then file an issue.

## Example

```tsx
import { state } from '@askrjs/askr';
import { createPlot, type PlotApi } from '@askrjs/charts';

const Plot = createPlot<ProjectRow>();

function ExportableRevenue() {
  const [api, setApi] = state<PlotApi<ProjectRow> | null>(null);
  return <>
    <Plot.Root data={rows} rowKey="id" label="Revenue" onApiChange={setApi}>
      <Plot.Line x="createdAt" y="revenue" />
    </Plot.Root>
    <button type="button" onClick={() => download(api()?.exportSvg() ?? '', 'revenue.svg')}>Export SVG</button>
  </>;
}
```

## Data export

`PlotApi.exportData(options?)` returns a string shaped by `view` (`current`/`full`), `rows` (`source`/`transformed`), `scope` (`all`/`visible`/`selected`), and `format` (`csv`/`json`). CSV output neutralizes cells that spreadsheet applications would otherwise interpret as formulas; JSON output serializes dates as ISO strings and represents non-finite numbers as `null` rather than silently dropping them.

## SVG export

`PlotApi.exportSvg(options?)` renders the resolved scene as an SVG string — it's purely an export format, not a mounted renderer and not a graphical SSR fallback. It requires a mounted plot with resolved dimensions, references fonts by name instead of embedding them, and by default excludes transient overlays like hover, crosshair, and brush state via `includeOverlays`.

## PNG export

`PlotApi.exportPng(options?)` returns a `Promise<Blob>` rasterized from the same resolved scene, with a `pixelRatio` option for high-density output and the same `includeOverlays` toggle as SVG export. Like SVG export, it needs an already-mounted plot — there's nothing to rasterize before the canvas has resolved dimensions.

## View selection

PNG, SVG, and data export all share the same `view: "current" | "full"` option: `current` captures exactly what's visible after any pan or zoom, while `full` captures the entire domain regardless of what the viewer has scrolled to. Picking the right one matters — a support screenshot usually wants `current`, while a downstream data pipeline usually wants `full`.

## Documentation navigation

[Previous](https://askrjs.com/docs/charts/live-and-view-state/index.md) | [Next](https://askrjs.com/docs/charts/recipes/index.md)