Deep Insider の Tutor コーナー
>>  Deep Insider は本サイトからスピンオフした姉妹サイトです。よろしく! 
SpreadJS入門[PR]

GrapeCity Garage SpreadJS入門[PR]

Web上でもExcel形式の表計算型のデータ入力やデータ表示を実現できる「SpreadJS」の概要と使い方が学べる連載。

デジタルアドバンテージ 一色 政彦
  • このエントリーをはてなブックマークに追加

GrapeCity Garage SpreadJS機能概説(1)[PR]

Excelライクなグリッド表示(スプレッドシート、表計算)を簡単に作れるJavaScriptライブラリ「SpreadJS」の機能概要[PR]

Web上でもExcel形式の表計算型のデータ入力やデータ表示を実現したい?! それならJavaScript UIウィジットの「SpreadJS」が利用できる。そのSpreadJSの特徴と機能概要をまとめる。

SpreadJSとは?

 SpreadJSの内部ではWeb標準技術が使われている

 SpreadJSが動作するブラウザーは?

SpreadJSの特徴

 非常に豊富な機能が提供されている

 Excel同等の関数を多数提供

 ユーザーはExcelの知識が活用できる

 長年の実績と経験が生かされたライブラリ

 パフォーマンスに対する配慮

  ファイルサイズ
  処理速度

まとめ

 

GrapeCity Garage SpreadJS機能概説(2)[PR]

Excelライクなグリッド表示(スプレッドシート、表計算)を簡単に作れるJavaScriptライブラリ「SpreadJS」の主要機能[PR]

Web上でもExcel形式の表計算型のデータ入力やデータ表示を実現したい?! それならJavaScript UIウィジットの「SpreadJS」が利用できる。そのSpreadJSの特徴と主要機能を開発者視点でまとめる。

SpreadJSの機能を試すための環境準備

SpreadJSでは何ができるのか? 開発可能な機能群

 スプレッドシートとしての基本機能

  シート
  タブストリップ
  スクロールバー
  行/列のヘッダー
  罫線(けいせん)
  行・列
  セル
  IME制御(一部ブラウザーのみ)
  グループ化
  背景色/文字色の指定
  文字装飾・フォント指定
  配置・セル結合
  セルの幅・高さの調整
  折り返して全体を表示/縮小による全体表示/隣接セルへのオーバーフロー表示
  セル表示形式を指定する書式
  条件付き書式
  枠固定
  スプレッドシート全体のExcelテーマ
  ドキュメントテーマ
  BootstrapやjQuery UIのテーマの適用

 表計算ソフトとしての計算機能

  数式
  配列数式
  関数
  独自の関数

 ヴィジュアライゼーション(情報の可視化)

  テーブル
  テーブルのフィルター
  テーブルスライサー
  スパークライン
  拡張スパークライン
  フローティングオブジェクト
  コメント

 ユーザー操作

  キーボード操作
  アンドゥ/リドゥ
  拡大/縮小表示
  ドラッグによるオートフィル
  ドラッグによる移動
  列のフィルタリング
  シートの保護とセルのロック
  印刷
  タッチ操作

 データ管理

  ソートとフィルター
  検索
  JSON形式でのデータの保存/ロード
  CSVファイルのインポート/エクスポート
  Excelファイル(.xlsx)の入出力
  タグ
  ダーティ状態のチェック
  データバインディング
  データの検証

 開発

  セル型
  カルチャ(ローカライゼーション/グローバリゼーション)
  TypeScript

まとめ

 

GrapeCity Garage SpreadJS機能概説(3)[PR]

ExcelライクなスプレッドシートUIを持つWebアプリの開発に挑戦してみた(SpreadJS活用)[PR]

JSONデータを活用した表とグラフの作成や、Excel互換関数による計算、印刷・CSVファイル出力といった機能を持つシングルページWebアプリの開発を体験してみよう。

作成するSpreadJSサンプルアプリ

SpreadJSアプリの開発

 作成するSpreadJSサンプルアプリとソースコード

 スプレッドシートを表示するHTMLファイル

 SpreadJSを操作するJavaScriptファイル

  JSONデータを取得する部分のコード(spreadjsapp.js)
  各種初期化を行うコード
  タイトル設定や行・列のサイズを調整するコード
  データ加工を行うコード
  データ確定後の初期化やワークシートのオプション設定を行うコード
  データソースからテーブルの作成と書式の設定を行うコード
  日付/数値の書式指定文字列について
  各セルへの関数の設定とスパークライン用データの作成を行うコード
  コメントを設定するコード
  スパークラインを作成するコード
  印刷を実行するコード
  CSVファイルを保存するコード

まとめ

 


 

SpreadJSで使える関数の一覧(カテゴリ・機能別)[Excel関数互換][PR]

SpreadJSで使える関数をカテゴリ・機能別で紹介。Excelユーザーに優しいExcel互換の関数になっているので、対応しているExcel関数ページのリンク付き。

SpreadJSで使える関数の一覧(アルファベット順)[Excel関数互換][PR]

SpreadJSで使える関数をアルファベット順で紹介。Excelユーザーに優しいExcel互換の関数になっているので、対応しているExcel関数ページのリンク付き。

 

サイトからのお知らせ

Twitterでつぶやこう!