JSFiddle - React, Tailwind, and code Playground

by stitot

HTML

<script src="https://cdn.jsdelivr.net/npm/@highcharts/grid-lite/grid-lite.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@highcharts/grid-lite/css/grid.css" />
    
  <div id="container">
  
  </div>

CSS

#container {
  height: 400px;
}

JavaScript

function generateDataTable(numRows, numColumns) {
  const result = { columns: {} };

  for (let col = 1; col <= numColumns; col++) {
    const colName = "column" + col;
    result.columns[colName] = [];
    for (let row = 1; row <= numRows; row++) {
      result.columns[colName].push(row);
    }
  }

  return result;
}


Grid.grid(
  "container",
  {
    dataTable: generateDataTable(52, 10), 
  },
  true
).then((grid) => {
  
});