Virtualization

by stitot

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Virtualization</title>
    <script src="https://cdn.jsdelivr.net/npm/@highcharts/grid-lite/grid-lite.js"></script>
    <script src="https://code.highcharts.com/dashboards/modules/math-modifier.js"></scrip
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@highcharts/grid-lite/css/grid.css" />
  </head>
  <body>
    <div id="container"></div>
  </body>
</html>

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(col + "." + row);
    }
  }

  return result;
}

Grid.grid(
  "container",
  {
    dataTable: generateDataTable(200000, 5),
    dataModifier: {
                    type: 'Math',
                    columnFormulas: [{
                        column: 'USD',
                        formula: 'B1*C1' // Multiply EUR (B1) with the rate (C1)
                    }]
                },
    rendering: {
      rows: {
        strictHeights: true,
        minVisibleRows: 15
      },
      columns: {
        distribution: "fixed",
      },
    },
    caption: {
      text: "Virtualization",
    },
  }
);