Inside of excel 方眼紙撲滅委員会 #pyfes

  • 2,253 views
Uploaded on

 

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,253
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
6
Comments
0
Likes
7

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Sphinx-users.jp 小宮健
  • 2. お前だれよ Twitter: @tk0miya 仕事  (株)タイムインターメディア所属  テクニカルオフィサ(技術責任者)として活動 参加コミュニティ  Sphinx-users.jp  Python mini hack-a-thon Sphinx を中心にツールを開発  blockdiag シリーズ  Sphinx 拡張機能の開発  Googlechart やカレンダー機能 #bookathon 他読書会やってます
  • 3. おしらせ Sphinx AdventCalendar  http://connpass.com/event/1441/  生贄 参加者募集中! SphinxCon JP 2013 Spring  2013/2/23 開催!  お手伝い募集中!
  • 4. http://www.flickr.com/photos/huskyte/7512877940/in/photostream/
  • 5. 今日の発表について 役に立つ話はやりませんExcel 方眼紙の撲滅もしませ ん Excel 推進もしません
  • 6.  いしもとさんすみません(予定)
  • 7. Excel 方眼紙撲滅委員会とは Excel 方眼紙を撲滅するための秘密結社 表計算はいいと思います ツールを作って/使って楽したい 要は『適材適所』しようということ ひとり委員会です。
  • 8. Excel 方眼紙が嫌いなところ マージが大変 誰かが図を壊すことが多い 更新が超面倒 ずれてる 方眼師(Excel 職人)のドヤ顔 最新版でどこが変わったのかよくわからな い そこで登場、更新履歴シート
  • 9. 更新が超面倒 Writing screen transions with Excel
  • 10. 更新が超面倒 Hard to add/remove elements ここに 1 画面追加
  • 11. 更新が超面倒 Expanding right node… 1.スキマを作る
  • 12. 更新が超面倒 Remove unnecessary arrows 2.不要な矢印を消す
  • 13. 更新が超面倒 Add new page-node… 3.図形を配置する
  • 14. 更新が超面倒 Connect allows new node and other. 4.矢印を調整
  • 15. ずれる Winding nodes… :-p
  • 16. ずれてる Winding nodes… :-p
  • 17. ずれてる Winding arrows… :-p
  • 18. ずれてる Winding arrows… :-p
  • 19. ずれてる Winding arrows… :-p
  • 20. 誰かが図を壊す Excel で画面仕様書を書く
  • 21. 誰かが図を壊す やっぱりずれる
  • 22. 誰かが図を壊す やっぱりずれる !?
  • 23. 解決策 / Resolutions blockdiag シリーズを使おう テキストを図に変換するツール群  blockdiag:ブロック図、画面遷移図、フローチャート  seqdiag:シーケンス図  actdiag:アクティビティ図  nwdiag:ネットワーク図、ラック図、パケットヘッダ 図  sphinxcontrib-webmocks: 画面仕様書 blockdiag は定義ファイル(テキスト)から画像を生成 する  レイアウトは自動的に行われる  増えても減っても適切にレイアウト  自由に並べ替えたい人には向きません
  • 24. blockdiag の例 このテキストが… { トップページ -> ログイン -> マイペー ジ; トップページ -> 商品一覧 -> 商品詳細; }
  • 25. seqdiag の例 このテキストが… { A => B => C; }
  • 26. nwdiag の例 このテキストが… { network { web01; web02; } network { web01; web02; db01; } }
  • 27. rackdiag の例 このテキストが… { 1: UPS [2U, 0.5A, 10kg]; 3: DB Master 4: Web Server (1) 5: Web Server (2) 6: LoadBalancer }
  • 28. packetdiag の例 このテキストが… { 0-7: Source Port 8-15: Destination Port 16-31: Sequence Number 32-47: Acknowledgment Number }
  • 29. sphinxcontrib-webmocks の例 このテキストが… .. page:: :名前: :text:`_` :都道府県: :select:`東京,神奈川,さいた ま` :住所: :textarea:`_` :button:`submit`
  • 30.  活動報告してきた @ #odstudy
  • 31. blockdiag の欠点 自由にレイアウトできない  → Excel 方眼紙は無敵 書き方を覚える必要がある  → Excel はだれでも使える(ことになって る) 環境を整備する必要がある  → Excel はどこにでも入っている 自由にレイアウトできない  → Excel はどこでも吹き出し付けられる!
  • 32. 世の中は Excel 縛りなことが多い なんだかんだ言ってみんな使える 過去の資産が Excel ですよ Office は買えるけど、Visio は買えない ロートル上司が(ry お客さんの指定が(ry 方眼紙欠乏症 他人の図をずらしたり壊したりしたい
  • 33. blockdiagcontrib-excelhogan blockdiagをExcel方眼紙に対応させるプラグ イン デモやります。
  • 34. blockdiagcontrib-excelhogan blockdiagをExcel方眼紙に対応させるプラグ イン
  • 35. blockdiagcontrib-excelhogan blockdiagをExcel方眼紙に対応させるプラグ イン  本当に方眼紙 (塗りつぶし)
  • 36. Excelhogan 版の仕組み blockdiag の imgaedraw プラグイン  画像の描画処理を担当  線書いたり塗ったり 本体には 3つの imagedraw プラグインを同 梱  PNG  SVG  PDF
  • 37. Imagedraw プラグイン I/F __init__, set_canvas_size, save  初期化と保存 line, rectangle, polygon, arc, ellipse, image  図形描画系関数  arc, ellipse, image は optional textlinesize, text, textarea  テキスト描画系関数
  • 38. Excelhogan 版の実装 方針: 描画はすべてセル単位にする すべての描画を pixel 単位に置き換える セルの塗りつぶし = point() メソッド xlwt で Excel ファイルを生成できる
  • 39. Excelhogan 版の実装 line() メソッド ループで point() を呼ぶだけ と思いきや 斜め線が必要 DDA (Digital Differential Analyzer) Algorithm  加減算のみで各ドットの座標を計算
  • 40. Excelhogan 版の実装 rectangle() メソッド 背景の塗りつぶし  ひたすら line() を呼びまくる 枠線  四辺それぞれに line() を呼ぶ
  • 41. Excelhogan 版の実装 polygon() メソッド 塗りつぶしは面倒なのでやらない  スキャンライン法とか使うといいはず 枠線は line() 呼べば解決 ココ
  • 42. Excelhogan 版の実装 ellipse() メソッド, arc() メソッド Optional なので見送り  blockdiag には ellipse.dots() メソッドがある  やればできそう
  • 43. Excelhogan 版の実装 text 系メソッド PIL によるダブルバッファリング  別バッファを作って、そこにレンダリング  Image#getdata() でピクセル情報が取得できる  最終的には point() でレンダリング
  • 44. Excelhogan 版の実装 メソッド間の依存関係
  • 45. Excelhogan 版の実装 つまり excelhogan を継承すると…  Point() 実装すれば図が書ける  あと初期化と保存 効率? 知らんがな
  • 46. デモ imagedraw プラグインの活用例 デモ  Another SVG  Shape xls
  • 47. blockdiagcontrib-animatedsvg SVG の <animate> タグを使う  attributeName=“opacity”  dur=“1s”  from=“0”  to=“1” opacity(透過度)を 1秒間で 0から 1に増や す begin 属性で順序を調整
  • 48. blockdiagcontrib-excelshape blockdiag でExcel方眼紙を出力させる @mzp さん作 OLE を使って、シェイプを生成 Windows かつ Excel 入り環境でのみ動作
  • 49. blockdiag Excel 対応版(OLE) blockdiag でExcel方眼紙を出力させる
  • 50. まとめ ネタに困って imagedraw プラグインを作った  Excel ネタにしたら反響多すぎて怖い  アニメーションSVG勉強したり  GIFアニメとか MPEG は力尽きた  役に立つかは知りません 最近地味なアップデートしかしてないのでせめて発表だけは動きを出しました。
  • 51. 蛇足 blockdiag アップデート月間はじめました  文句言うと採用されやすい Python2.4 捨てようか悩んでます  意見募集中 @ blockdiag-discuss