Skip to content

Helpers

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

clearPersistedChart();      // clear default persisted state
clearPersistedChart(id);    // clear a specific instanceId

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.

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 · Vue · Angular & web components.

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

Developer & LLM documentation · Not the end-user Help Center · Help Center