Format data

Data is formatted using the data type setting in the schema. The data type is mapped to the grid.formatters object. In the following example col2 is data type date which will format data using the grid.formatters.date function. By default the string formatter is used to format all data. This method of formatting is faster than using the rendertext event.

import canvasDatagrid from 'canvas-datagrid';
import data from '/data.json';

const app = document.getElementById('app');
const gridElement = document.createElement('div');
const grid = canvasDatagrid({
  parentNode: gridElement,
  data,
  schema: [
    { name: 'col1' },
    {
      name: 'col2',
      type: 'date',
    },
    { name: 'col3' },
  ],
});

grid.formatters.date = function (e) {
  return new Date(e.cell.value).toISOString();
};

app.append(gridElement);