---
url: https://chartbuddy.io/embed/docs/api/helpers.md
---
> Docs index: [llms.txt](https://chartbuddy.io/embed/docs/llms.txt)

# Helpers

```js
import {
  getInsights,
  snapshotInsights,
  version,
} from '@chartbuddy.io/embed';

getInsights();              // { [instanceId]: Insight }
// Also mirrored at window.__CHARTBUDDY_INSIGHTS__

await snapshotInsights();                 // config-only for all mounts
await snapshotInsights({ png: true });    // + pngBase64 (default white bg)
await snapshotInsights({ png: true, background: '#0f172a' });

console.log(version);       // e.g. '1.7.50'
```

## Validation

```js
import {
  validateChartData,
  assertValidChartData,
  formatValidationIssues,
  ChartDataValidationError,
} from '@chartbuddy.io/embed';

validateChartData(candidate);            // → { valid, issues, errors, warnings }
validateChartData(cd, { form: 'resolved', requireSomething: false, maxIssues: 5 });

assertValidChartData(candidate, '[my-app]');   // throws ChartDataValidationError
formatValidationIssues(result.issues);         // human-readable multi-line string
```

Full reference: [Validation](https://chartbuddy.io/embed/docs/quality-assurance/validation.md).

## Framework bindings

```js
import { InsightChart, useInsight } from '@chartbuddy.io/embed/react';
import { InsightChart, useInsight } from '@chartbuddy.io/embed/vue';
import '@chartbuddy.io/embed/element'; // <chartbuddy-insight> — Angular & anything else
```

Guides: [React](https://chartbuddy.io/embed/docs/guides/react.md) · [Vue](https://chartbuddy.io/embed/docs/guides/vue.md) ·
[Angular & web components](https://chartbuddy.io/embed/docs/guides/angular.md).

On each `Insight` instance:

```js
await insight.toPngBase64();                          // default background #ffffff
await insight.toPngBase64({ background: '#0f172a' }); // custom opaque underlay
await insight.toPngBase64({ background: null });      // transparent
await insight.toPngBlob({ background: '#ffffff' });
insight.getChartData();
insight.setData(seriesData);                          // data-only refresh
insight.update(patch);                                // partial patch
insight.on('change', (cd) => { /* … */ });
insight.isDirty();
insight.downloadPng();                                // human Save; transparent default
insight.downloadPng({ background: '#ffffff' });       // opaque human download
```