🗂

転職してエクセルファイルを読み解いてHTMLに変換する仕事をしていたが、悪役令嬢は出てこないし、勇者パーティーも追放されなかった話

に公開2
26

こんにちは。アルダグラムのテクニカルフェロー(自称?)をしている蓬莱です。
(特に社内外でアナウンスされているわけでもないので、本当に自称かも知れない。。)

とあるMから始まるGAFAM企業をやめてブラブラしていたところを、縁があってアルダグラムに入社させていただく事になりました。(もうちょっとで半年になります)

突然ですが、皆さん、エクセルファイルを読んでますか?

「普通に仕事でエクセル使ってるわー。嫌やけど。」

みたいな話じゃありません。

エクセルファイルをアプリではなく人間が読むという話です。

ちょっと何言ってるかわかんない・・

って帰ろうとしたアナタ!ほんのもう少しだけお付き合いください。。(頼みますから・・)

とりあえず、このgif動画を見てみてください。(gifなので巻き戻せないのが難点)


エクセルファイルをhtmlに変換している例

高速にエクセルファイルをHTMLファイルに変換しているのがわかると思います。(外部APIは使ってません。そもそもネットワーク未接続だし。)

java -jar excel2html.jar 日本製薬工業協会.xlsx Output

というコマンドを打つと、Outputフォルダにhtmlファイルとjsonファイルがシートの数だけ生成されています。

この excel2html.jar というのが私が単独開発した、エクセル変換エンジンでございます。

これを実現するためには(なぜ必要なのかは略)、どうしたってエクセルファイルを読み解いていく必要があります。

ほら、あなたもどうやったらエクセルファイルが読めるようになるか気になってきたでしょ?

では、紹介していくよ!

エクセルファイルはただのzipファイルだよ

xlsx ファイルは、実はただのzipファイルなので unzip input.xlsx -d folder みたいにすれば中身を取り出すことができます。 大体こんな感じのファイル構成になってます。

いろんなデータはあるんだけど、最も重要なのは worksheets フォルダにある sheet1.xml, sheet2.xml, .. というやつ。
こいつらが、各シートそのものを表しているよ! (例えば、シートが3枚のエクセルファイルだとsheet1.xml,sheet2.xml,sheet3.xmlとあるはず)

あとは埋め込み画像とかはmediaフォルダに入っているし、シートで使われている文字列はsharedStrings.xmlというのに入っている。

ほら、怖くないでしょ?

仕様はISO29500として公開されているよ

「いやいや、そうは言われてもどうやってそのXMLファイルを読むの?ややこしいんじゃないの?」


お目が高い

いやいや、でも仕様は公開されています。 ISO29500として。ほらね。

https://www.iso.org/standard/71691.html

「ん?今5000ページを超えるとか言わなかったか?てか、この仕様って英語じゃね?」

お気づきになりましたか・・

でっ、でも、実際は全部読む必要ないよ!wordとか他のOffice文書の仕様も書かれているし、全部エクセルの仕様ってわけじゃないんだからっ!

実際HTMLにするのはどんな流れ?

あ、あれだ。一度実際どんな感じで読むのか例を交えて説明すれば怖くないってわかってもらえるはず。信じてるぞ

大まかな流れはこんな感じだけど、とりあえず実際の例を見ていこう。

  1. sheet XML を読んで、各セルに何が入っているかを取得 (数字とか文字とか)
  2. セルのスタイルを styles.xml から取ってくる (色とか罫線とか、文字寄せとか)
  3. セル自体はHTMLの<td> タグにして、CSSのstyleを適用させる
  4. (結合セルとか、画像貼り付けとかその他諸々)

とりあえず、下記の御見積書ファイルのA1セルを見てみよう。xlsxファイルをunzipしてsheet1.xmlを見ていく。


適当に作った見積書。A1セルに御見積書って書いてあるね

するとA1セルらしきものには27という謎の数字が入っている


あれ?27って何?

「なんで御見積書って文字がはいってへんねん!」

と思うかもしれないが、心配御無用でござる。この27という数字はsharedStrings.xmlの27番の要素を見に行けという意味なのでござった。(0から始まるので28番目の要素)

じゃあ sharedStrings.xmlを見に行こう。

ほら!御見積書って書いてあった!怖くないだろ?

同じようにstyleを取りに行くには s="32" という情報を手がかりに styles.xml を読みに行けばOK。

そこには fontId="5" ってあったり、borderId="0" ってあったり色々かいてあるけど、結局は芋づる式に見ていけば必要な情報は全て styles.xml の中にあるよ。

「いやいや、"MS P明朝"って!端末によっては表示できないじゃん?」

と思った人はいるかもしれないけど、ここは例えば 'Noto Sans JP' とかにしてしまえば表示はされます。(時には妥協も必要なのでございます。

他にもセルの結合はどういう風になってるか、画像はどう処理するんだよ?とか書いてたらキリがないので、一旦この辺で切り上げようと思いますが、どうしても気になって夜しか眠れない人に一言。

それ、全部ISOに書いてあるよ!

最後に

ホントは悪役令嬢と勇者パーティーの話が書きたかったのですが、力尽きてしまいました。ただ、アルダグラムは流れ者の自分みたいな転職者にも優しくしてくれて、挑戦的な技術開発とかを暖かく見守ってくれる文化があると思いました。なんかWowを届ける賞ってのももらったよ!

意地悪な令嬢もいないし、追放もされてません。(今のところ)

もっとアルダグラムのエンジニア組織を知りたい方はこちらをご覧ください!

26
アルダグラム Tech Blog

Discussion

Yutaka CatchYutaka Catch

いいね。Apache POIと比べてどうでしょう?
https://poi.apache.org/

hiroyahoraihiroyahorai

コメントありがとうございます!

apache POI は見た目を再現すると言う用途にはあまり向いてないのと、何より速度が遅いので選択肢からは除外しました。

けど部分的にPOIを使っているところもあります。(emfという形式の画像ファイルを読む時など)。

よろしくお願いします!

ログインするとコメントできます
26