Docs › More

Moving from To●●t UI Chart

Replace To●●t UI Chart, archived (no longer maintained) in September 2026.

NHN archived the To●●t UI Chart repository in September 2026; it no longer receives fixes. 82chart aims at the same place (Korean screens, free, no dependencies) and the data looks alike, so most of the work is renaming.

Before

<link rel="stylesheet" href="https://uicdn.toast.com/chart/latest/to●●tui-chart.min.css">
<script src="https://uicdn.toast.com/chart/latest/to●●tui-chart.min.js"></script>
<div id="chart"></div>
<script>
  // columnChart = vertical bars (barChart is horizontal there)
  const chart = to●●tui.Chart.columnChart({
    el: document.getElementById('chart'),
    data: {
      categories: ['1월', '2월', '3월'],
      series: [{ name: '매출', data: [32000000, 41000000, 38500000] }],
    },
    options: { chart: { title: '월별 매출', width: 600, height: 400 }, yAxis: { title: '원' } },
  });
</script>

After

<link rel="stylesheet" href="https://82chart.com/cdn/v0.2.0/82chart.css">
<script src="https://82chart.com/cdn/v0.2.0/82chart.min.js"></script>
<div id="chart"></div>
<script>
  const chart = Chart82.createChart('#chart', {
    type: 'bar',
    title: '월별 매출',
    unit: '원',
    height: 400,
    data: {
      labels: ['1월', '2월', '3월'],
      series: [{ name: '매출', data: [32000000, 41000000, 38500000] }],
    },
  });
</script>

Name map

To●●t UI Chart	82chart
`data.categories`	`data.labels`
`data.series[].name / data`	Unchanged: `data.series[].name / data`
`columnChart`	`type: 'bar'`
`barChart` (horizontal)	`type: 'bar', horizontal: true`
`lineChart` / `areaChart`	`type: 'line'` / `'area'`
`pieChart` (+ `series.radiusRange` for donuts)	`type: 'pie'` / `'donut'`
`scatterChart` / `bubbleChart`	`type: 'scatter'` (+ `r` on points)
`radarChart`, `gaugeChart`	`type: 'radar'`, `'gauge'`
`columnLineChart`	`type: 'bar'` with `type: 'line'` on the line series (combo)
`options.series.stack`	`stacked: true` or `'percent'`
`options.series.zoomable`	`zoom: true`
`options.exportMenu`	`exporting` (on by default)
`options.chart.title` / `width` / `height`	`title` / parent width / `height`
`options.theme`	CSS variables `--c82-*`
`chart.setData(data)`	`chart.update(data)`
`chart.on('clickSeries', fn)`	`chart.on('click', fn)`

Heatmaps, treemaps, box plots, bullet charts, radial bars and nested pies are not there yet; heatmaps are planned for the next version.
82chart follows its parent's width, so no width is needed.
On Korean pages the axis uses 만·억 units; for report-style commas use numberFormat: 'comma'.