2008年2月19日火曜日

JavaScriptでExcelデータをtable要素に変換

(X)HTMLのtable要素は多量のデータを整理してくれる優れものですが、(X)HTMLソースからは直感的に全体像が見て取れず、それ故、編集が面倒、という理由から今まで敬遠していました。
この欠点を解消するため、Excelの表データをtable要素に変換するJavaScriptを書いてみました。

使い方

  1. Excelファイルを開き、table要素に変換したい部分を範囲選択してコピー (マウスでぐぐ~っと選択すればOK)
  2. 変換スクリプトのフォーム上に貼り付け
  3. [変換] ボタンをクリック!
  4. table要素に変換されたHTMLソースが出力される

内部動作 (アルゴリズム)

Excelからクリップボードにコピーされたデータは「タブ文字区切りのCSVフォーマット」となっており、これを array[行][列] で構成される多次元配列に変換します。
(各セルにあるデータはタブ文字で区切られているので split("\t") で良さそうに思えますが、実際にはセルデータに改行が入っているデータをコピーした時にセルデータ全体をダブルクォートで括られるケースがあり、これに対応するために少し複雑な処理をしています。)
多次元配列に変換したら、配列データを元にtable要素に変換して終わりです。

# 特殊なことはしていないつもりですが、平均よりちょっとユーザー定義関数が多めかもしれません。
# preg_replace() とか hreg_replace() は個人的趣向がかなり入っているので、人によっては読みづらいかもしれません……。

更新履歴

2008/02/19 2:00
 - 初版
2008/02/20 1:23
 - ダブルクォートで括られたセルデータが改行区切りで指定されていたとき、一つのセルデータとして扱う場合があった不具合を修正 ("hogehoge"\nhoge2")

既知の不具合/仕様

  • 結合されたセルがtable要素に反映されない。(クリップボードに格納されたデータにセルの結合を示す情報がないので、対応できません。)

ToDo

  • 1列目を項目名として扱い、[1列目のデータをth要素に変換する] オプションを追加
  • table要素からExcelデータに戻せるように変換

ラベル:

1 件のコメント:

Anonymous 匿名 さんは書きました...

はじめまして。まさにこうした変換をしてくれるサイトはないかと探していてこの記事に出会いました。活用させていただきます。ありがとうございます。
また、(自分用のメモも兼ねて)私のブログからリンクをはらせていただきました。
1点だけ、「CSVを変換」というと、カンマ区切りテキストを変換するように理解したのですが、「TSV」という表現は余り使わないのでしょうか?(.tsvという拡張子は規定されていないということを聞いたことがあるような気はするのですが)

2008年3月18日 3:57  

コメントを投稿

登録 コメントの投稿 [Atom]

<< ホーム