====== Jspreadsheet ======
JavaScript で Excel ようなスプレッドシートを実現するライブラリです。最近、「jExcel」から「Jspreadsheet」に名称変更しました。
下記3つの構成になっています。ここでは、Jspreadsheet CEについて説明していきます。

  * 無償版(MITライセンス)の Jspreadsheet CE
  * 有償版の Jspreadsheet Pro
  * クラウド版の Jspreadsheet Cloud

==== 参照 ====
  * [[https://www.tohoho-web.com/ex/jspreadsheet.html|とほほのJspreadsheet入門]]
  * [[https://neos21.net/blog/2022/01/30-01.html|JS のみで Excel 風スプレッドシートが作れる Jexcel (Jspreadsheet) を試す]]

===== Handsontableとの違い =====
  * 同じ作者のJsuitesというライブラリを使用する必要があります。
  * JS配列、JSON、CSV、XSLXファイルからデータを読み取ることができます。
  * loadData メソッドの代わりとして、setData メソッドに書き換えます。
  * JSONのマッピングは、data 属性から name 属性に書き換えます。
  * enterMoves オプションがないため、Enterキーで次のセルに移動できない。
  * outsideClickDeselects オプションがない。
  * fillHandle オプションの代わりに、selectionCopy オプションを使用する。 \\ 参照:[[https://github.com/jspreadsheet/ce/issues/996|Disable the dragging corner #996]]
  * readonly 属性が true でも setValue で値をセットすると外れてしまう。 \\ セット後に instance.jexcel.getCell(cellName).classList.add('readonly'); を追加する
  * 位置（x,y）からcell値(例 A1)を変換するには、jexcel.getColumnNameFromId([x, y]) を使用する。
  * jexcel の名前を変数として使用すると、内部の jexcel.getColumnNameFromId 関数など使用できなくなる。
  * デフォルトで列ヘッダーが表示される。列ヘッダーを表示有無の rowHeader オプションは無い。

==== readonlyの色を変える ====
デフォルトは薄い
<code css>
.jexcel > tbody > tr > td.readonly
{
    color:rgba(0,0,0,0.3)
}
</code>

もう少し濃くする。
最後の「0～1」がalpha値になります。「0」に設定した場合は完全に透明になります。また、「1」にした場合は透過されません。

<code css>
.jexcel > tbody > tr > td.readonly 
{
    color:rgba(0,0,0,0.5)
}
</code>

==== 列ヘッダーを消す ====
hideIndex オプションは無いようなので、hideIndex()　メソッドを実行する、または下記のCSSを使用する。

<code css>
.jexcel colgroup col:first-child {
    width: 0 !important;
}
</code>

[[https://github.com/jspreadsheet/ce/issues/288|Hide row number column #288]]