Skip to content

Sample: Editable Insight

Live preview

Opens in edit mode with the formatting toolbar. Use Done on the ChartBuddy ball to return to view.

Code

html
<div id="chart" style="width:960px;height:560px"></div>
<script type="module">
  import { Insight } from 'https://unpkg.com/@chartbuddy.io/embed';

  new Insight('#chart', {
    editable: true,
    toolbar: true,
    persist: false,
    chartData: {
      chartType: 'clusteredBar',
      isDataTransposed: true,
      seriesData: [
        ['', 'Q1', 'Q2', 'Q3'],
        ['Revenue', 100, 112, 125],
      ],
      title: { visible: true, text: 'Editable demo' },
      subtitle: { visible: false, text: '' },
      legend: { visible: false },
    },
  });
</script>

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