はじめに
これは、Jspreadsheet Advent Calendar 2024の1日目の記事となります。
筆者は、opengl-8080氏のHandsontable 使い方メモ シリーズを開発する際に何度も参考にし、2018年にはHandsontable Advent Calendar 2018を主催するようになりました。
Jspreadsheet は日本語の記事が少ないです、開発する際に参考となるようにしていきたいです。とほほさんに負けないようにね。
Jspreadsheetとは
WEBで Excel のようなスプレッドシートライクな入力を可能にしてくれる JavaScript ライブラリです。
Jspreadsheet の開発しているのはイギリスにある会社となります。2019年に jExcel から Jspreadsheet に名称を変更しました。同様ライブラリーには、Handsontable があります。画面等が似ているのは初期ごろの Handsontable をフォークしたためです。
販売形態としては下記3つの構成になっています。
- 無償版(MITライセンス)の Jspreadsheet CE
- 有償版の Jspreadsheet Pro
- クラウド版の Jspreadsheet Cloud
次項目以降は、無償版(MITライセンス)の Jspreadsheet CE のみの説明になります。
Jspreadsheet CE Version 5
2024/12/19にJspreadsheet CE Version 5 beta 3がリリースされました。
2025年中には、beta が取れて正式リリースとなることでしょう。
Version 5 は主に2つが大きく変更されています。
- 複数シートの操作の可能
- Pluginとカスタムエディターのサポート
導入
幾つかの方法があります。
CDN
v4
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jspreadsheet-ce/dist/jspreadsheet.min.css" type="text/css" />
<link rel="stylesheet" href="hhttps://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.css" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/jspreadsheet-ce/dist/index.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.js"></script>
v5
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jspreadsheet-ce@5.0.0-beta.3/dist/jspreadsheet.min.css" type="text/css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.css" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/jspreadsheet-ce@5.0.0-beta.3/dist/index.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jsuites/dist/jsuites.min.js"></script>
補足
Jsuites は、Jspreadsheet の作者が作成している JavaScript Plugins となります。
MITライセンスとなっています。
NPM
v4
npm install jspreadsheet-ce@4
npm install jsuites
v5
npm install jspreadsheet-ce@5.0.0-beta.3
npm install jsuites
ダウンロード
v4
https://github.com/jspreadsheet/ce/releases
https://github.com/jsuites/jsuites
v5
https://bossanova.uk/jspreadsheet/v5/jspreadsheet.zip
https://github.com/jsuites/jsuites
使い方
これから記事を書いてリンクしていきます。
- Jspreadsheet 使い方メモ１（基本）
- Jspreadsheet 使い方メモ２-1（グリッドのオプション）
- Jspreadsheet 使い方メモ２-2（グリッドのオプション）
- Jspreadsheet 使い方メモ２-3（グリッドのオプション）
- Jspreadsheet 使い方メモ２-4（グリッドのオプション）
- Jspreadsheet 使い方メモ３（カラム・セルオプション）
- Jspreadsheet 使い方メモ４-1（メソッド）
- Jspreadsheet 使い方メモ４-2（メソッド）
プラグイン
Jspreadsheetの機能を拡張するプラグインがあります。
今のところ Pro版のみですが、CE Version 5 からプラグインがサポートされるため参考になりそうです。
改善点
Version 5 でも修正されていなかったため、issue に登録しました。
これで修正されるといいのですが・・・
作者からの回答があり、残念ながらCE版の制限となりました。
サンプル
CSVファイルの読み込みや、数式対応およびツールバーなど実装しています。
最後に
少しずつでも記事を増やしていく予定です。