Handsontableとは

公式サイト：https://handsontable.com/

Webページ上でスプレッドシートのような表を作成するJavaScriptライブラリ。

使用方法

ドキュメント：https://handsontable.com/docs/javascript-data-grid/

ライブラリ導入

CDNから読み込むのが簡単である

参考：https://handsontable.com/docs/javascript-data-grid/installation/

<link href="https://cdn.jsdelivr.net/npm/handsontable/dist/handsontable.full.min.css" rel="stylesheet" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/handsontable/dist/handsontable.full.min.js"></script>

データ読み込み

データ読み込みはスクリプト上からのみ行え、HTMLのテーブル要素から読み込むことはできない。

参考：https://handsontable.com/docs/javascript-data-grid/binding-to-data/

集計

数値列について、合計、最大、最小、平均などの集計を行うことができる。

参考：https://handsontable.com/docs/javascript-data-grid/column-summary/

参考：https://handsontable.com/docs/javascript-data-grid/api/column-summary/#options

ソート

文字列、数値などの型によって異なるソート方法を選択できる

参考：https://handsontable.com/docs/javascript-data-grid/rows-sorting/

セルの編集不可

デフォルトではセルは編集可能である

参考：https://handsontable.com/docs/javascript-data-grid/disabled-cells/

セル内のHTML可

参考：https://handsontable.com/docs/javascript-data-grid/cell-renderer/