2021/06/05 21:27
uzulla
これは参考になる…
2021/06/05 23:50
amagoma
これは叡智かも。この人すごいな。
2021/06/05 23:55
Keisuke69
いつか使うことありそうなので頭の片隅に置いておこう。そういえばWebに限らず帳票出力が必要なシステムって開発したことないな
2021/06/06 00:05
murishinai
次の次世代くらいにはこれがもっと簡単にできるようになってるんだろか
2021/06/06 00:06
door-s-dev
なんか良さそう。明細行が多くて2ページにわたるケースは対応できないか
2021/06/06 00:11
i196
僕が働いてる間には、帳票印刷って無くならないんだろうなぁ
2021/06/06 00:15
tofu-kun
賢い。これはメンテしやすいだろうな。
2021/06/06 00:42
ponpon_qonqon
「よし！Excelで帳票ベースを作ってからPDF出力してPDF2SVGで変換して使おう！」
2021/06/06 00:45
homaju
SVGで様式作るやり方
2021/06/06 00:58
Guro
“HTML”
2021/06/06 01:16
sigeharucom
PdfBoxで頑張って描いてる。PdfBox用のいろんなオレオレライブラリが出来た。
2021/06/06 01:25
ssttaacc
行やページ可変がない固定フォームへの流し込みならこれでよさそう。
2021/06/06 01:25
izoc
多少のWYSIWYGを犠牲にしてでも圧倒的なメンテナンス性のExcel出力→PDF変換を推しますね
2021/06/06 01:30
natu3kan
ハードの都合などで印刷時でレイアウトがちょっと崩れたりするのがあるから大変だよな。
2021/06/06 01:40
capsxen
chromeで印刷してみたら空白の2ページ目が出現した
2021/06/06 01:40
srng
やはり印刷系はPSやSVGに帰結するのか
2021/06/06 01:54
awkad
このあたりはSI系と世界の断絶を感じるね。意地でも商用ソフトは買わないんだな。SVFなり買えばいいだけでしょ。関係ないけどジョブ系もショボいOSS使うならJP1とか買えばいいのにと思う。
2021/06/06 01:57
taku-o
グッド
2021/06/06 02:05
hyperash
頻繁にバージョンが上がるブラウザの印刷機能に依存するのは怖いなあ。ブラウザ別のテストが増えるというのもデメリットか。Excel→PDF変換のほうが保守コストが圧倒的に低いし実現できることも多い。負荷対策は要る。
2021/06/06 02:09
Shinwiki
酸素欠乏症にかかって…
2021/06/06 03:05
youichirou
なるほどなぁ。1ページ帳票だとこうなるか。
2021/06/06 03:19
fashi
「複雑なレイアウトのテーブルを組み立てる」この作り方が違う気がする。同僚は方眼ベースのCSSのDIVの組み合わせでレイアウトしてwkhtmltopdfでPDF化していた。縮小して全体を表示は未解決だけど
2021/06/06 03:25
masudatarou
POIとかでExcel→PDFか 最初からPDF出力かな
2021/06/06 04:00
retronics
おじさんにはもう謎の呪文を唱えている風に感じる。無詠唱で頼む。
2021/06/06 04:28
honeybe
SVGかー
2021/06/06 04:47
lazymaybee
HTMLのほうが柔軟で好きかな。どちらにしても最後にwkhtmltopdf通した方が安全そう。印刷はプリンターの設定に左右されるから下のマージン詰めるのは怖い
2021/06/06 04:58
eartht
ブコメ見るにこの頑張りは要考慮かも。webなんてすぐ環境変わっていくし。
2021/06/06 05:23
StrawberryGelato
帳票
2021/06/06 06:15
onesplat
2021年に帳票で悩むってお前
2021/06/06 06:29
chimerast
これはWebブラウザ単体で完結させようとすると、そうかもしれない。昔同じようなことを、Wordで作ったテンプレートをPOIでいじってやったなあ。テンプレートのメンテナンスをエンジニア以外ができるのが良い。
2021/06/06 06:33
maketexlsr
見積納品請求は(ペーパーレスに出来ないなら)国が規格作って全国統一で罰則ありで二度と変えないテンプレ作ってくれ。少なくともA4以外は認めないようにしてくれ…
2021/06/06 06:34
qmanothe
帳票
2021/06/06 06:41
muchonov
メモった。phpspreadsheetでやってることを全部置き換えできるかも
2021/06/06 07:04
dubdubchinchin
“印刷時に見た目が一切崩れない ”Excel「今俺の悪口言うたか？」
2021/06/06 07:42
keidge
いくら頑張ってもSVFには勝てない。
2021/06/06 07:42
mayumayu_nimolove
面白い。こんなの思いつかないわ
2021/06/06 08:04
ene0kcal
ChromeのPDF印刷で余白問題はあるある。過去バージョンアップで簡単に空白ページの2枚目が現れた。
2021/06/06 08:07
mk_55
アクセシビリティ対応（タグ付け）ができないので実案件ではつらそう。/コメントにでてるExcelを使う手法だが、帳票出力のためにシステムの一部としてExcekを組み込むのはライセンス上いいのか気になる
2021/06/06 08:07
Cru
門外漢の感想。印刷要らない時代になれば良いのにね
2021/06/06 08:08
kijtra
なるほど。JavaScriptでも扱えそうなのがいいけど、こういうのって印刷よりダウンロードさせたい要望の方が強いよね。PHPでやるなら dompdf の方が低コストだと思うけど。
2021/06/06 08:08
lli
次はドットインパクトプリンタにも対応してもらおうか
2021/06/06 08:18
wdr_s
細かい調整が必要で、なおかつデザインのクオリティをある程度保ちたい場合に有効そう。
2021/06/06 08:19
fumisan
ここまでくると、連続紙にハイフンで区切ってテキスト印刷でもいいかと諦め
2021/06/06 08:23
nonorth
そもそも帳票を作るな！😡
2021/06/06 08:32
yuzuk45
参考になります
2021/06/06 08:41
ryota5637
編み出した本人がベストプラクティスって不遜すぎ。コミュニティ中でたくさんの人や時間をかけて評価が定まっていってこれがベストだなと共通認識としてなんとなく浮かび上がってくるもんだろベストプラクティスはよ
2021/06/06 08:43
ln_north
紙・A4という概念自体が廃れていってほしいなぁ・・・、Webと相性が悪い。
2021/06/06 08:57
warp9
きっと凄いのだろう。でも印刷物の体裁には拘りたくないな。
2021/06/06 09:01
rkosaka
ブラウザに依存してるのがなあ
2021/06/06 09:15
prograti
ベストプラクティスかどうかは要件次第だけど、この方法も十分にアリですね。個人的にはAdobeのDocument Generation APIが気になってるので日本語OKなら試してみたい。SVFクラウドは小さい案件だと価格がネックかな。
2021/06/06 09:22
greenbow
“僕の考えた最強の帳票印刷” は「ベストプラクティス」とは呼ばない気が。 / ひとつの「プラクティス」ではあるけど「ベスト」なのかわからない状態では。 / 言葉の使い方が気になってるだけです。
2021/06/06 09:24
kotesaki
メモ
2021/06/06 09:31
lenore
こうやって自分が手を動かして辿り着いた方法を発表してくれるだけ充分いいと思うよ。皆の意見も集まるし。/「オレ的ベストプラクティス」ってことで。/自分はExcelテンプレート利用(PDFオプション有)派。大量帳票は商用
2021/06/06 09:32
Eiichiro
40頁超えたあたりからChromeが激重に。改ページが安定せず1mm以外のズレは発生する（既存枠への差し込みは不可）ページカウントは自力実装。あたりがネック。エクセルもフォント折返し問題あるし。PDF直が安心だったり。
2021/06/06 09:34
harumomo2006
SIでも予算がないプロジェクトだと購入費用出せないしフルスクラッチが条件の場合もソースコードが納品できない外部ソフトは使えないことある。そしてフリーのPDF化ツールは日本語の扱いがバグってたりするし地獄
2021/06/06 09:35
stabucky
帳票のデザインをユーザーに任せちゃえばいいんじゃないの？となればエクセル方眼紙でも何でも作らせればいいじゃない。
2021/06/06 09:38
juniper
“でエクスポートしたものをテンプレートとしてアプリで読み込み プレースホルダーに当たる文字列を置換した上でSVGをそのままHTMLに埋め込んで出力し SVGの外側のレイアウト（プレビュー画面の見え方、印刷時のページ設
2021/06/06 09:39
q-yoshida
テンプレートが動的に書き換わるようなケースは対応できるのかな。明細の行数が変わったり、特定の項目を非表示にしたり。SVGなんでいじれなくはなさそうだけど・・・。
2021/06/06 09:40
amemiyashiro
まず「本当に帳票印刷が必要か？」という業務フローの見直しから始めよう、とちゃぶ台をひっくり返す。
2021/06/06 09:47
iww
絵を描く方法らしい
2021/06/06 09:53
yarumato
“既存方法の欠点：HTMLで作ってブラウザ印刷はA4一枚ピッタリ収まる前提に不適。Excelテンプレートは地獄のExcel方眼紙。ベストはAdobeXDやFigmaで帳票デザインしSVG出力->HTMLとCSSで印刷に最適化->実際の値に置換”
2021/06/06 10:04
securecat
PostScriptで書いてMIME的にPDFと誤認させるのがベストプラクティスだったこともありましたよね？
2021/06/06 10:09
nogajun
LibreOffice警察です。単にあんたが慣れてるもの使っただけじゃん。LibreOffice使うならxlsx,docx使うな。odt,ods使え。スタイル作れ。ODFとスタイルでできる同じことを書かれてもな、というお気持ち
2021/06/06 10:10
casm
そっからさらにSVG2PDFしたらもっと上手くいかんかのう。
2021/06/06 10:16
dreamzico
前提から間違っている記事。ベストプラクティスは「紙の帳票は全廃」ですよ。紙じゃないと取引をやめる！と言う馬鹿は切れ。総合的にマイナスな害悪存在だから。せっかくのWebアプリなのに最後紙にするとか本末転倒。
2021/06/06 10:18
ifttt
カッチョイイ帳票を印刷する場合であって、そもそも帳票でカッコつける必要があるのか
2021/06/06 10:22
opnihc
肯定意見が序盤のコメントに固まってるの互助会っぽい
2021/06/06 10:32
quabbin
データポータルのが楽
2021/06/06 10:39
mogami74
私はそもそもXDでまともにデザインできないんだけどみんなどうやってんの…どこかに教わりに行かないとだめなんかな。動画とかでいいのないかな。
2021/06/06 10:55
homarara
JasperReportsは選択肢に無いの？
2021/06/06 11:00
whiteball22
帳票に関するものってActiveReportsしか知らなかったから参考の一つとしておこう
2021/06/06 11:08
oktnzm
まあ単票ならいいんじゃないっすかね（優しい目）
2021/06/06 11:12
kuracom
SVGをテンプレートにするのは興味深い。小規模なら良さそう。安定性を求めるならwkhtmltopdf挟んでPDF書き出す方が良いと思う。
2021/06/06 11:16
chOn
帳票作るなって、業種によっては法律で決まった様式に出力しなきゃいけないとかあるしねぇ印刷しないにしてもPDFまでは手段もっておかないと。
2021/06/06 11:16
Gka
帳票の体裁を整える仕事…これが最近話題のブルシットジョブか。
2021/06/06 11:19
aike
まだ見積書納品書請求書源泉徴収票などは無くせないので必要は必要。昔はCrystal Report使ってた。社内システムならその手の製品もいいけど事業者向けサービスとして提供する機能ならライセンス的にこういう手法も必要。
2021/06/06 11:28
mr_mayama
読みやすい文章だけど目的に対してSLAのないプロプライエタリのオンパレードなので帳票が必要なシチュエーションで問題起こりまくりかつ真似されて二次被害が心配
2021/06/06 11:33
sabinezu
複数ページの時は？HTML5で書いた方が早そうだけど。
2021/06/06 11:37
underd
あとでよむ
2021/06/06 11:39
ryunosinfx
js無効状態だと何も見えないな。以上
2021/06/06 11:40
delimiter
表にしないカルチャーが普及して欲しいね
2021/06/06 11:41
phoope
なるほどー
2021/06/06 12:17
ledsun
（SVGの）"複数行テキストの自動折り返し・自動縮小に対応します。これは正直かなりの力技で対応する必要があります"ワロタ（笑えないし、わかる）
2021/06/06 12:19
mezamashi0540
まずは帳票が本当に情報処理として必要か、それから帳票が得意なアプリの連携を提案したい。DXとかRPAの宣伝のおかげで他アプリ連携について忌避感が下がってるので。| これ開発者全員が嫌がる機能になりそう。
2021/06/06 12:19
hamamuratakuo
なるほど😲SVGはテンプレートとして活用できるんですね！以前PDFで苦労したので発想が参考になりました。情報提供どうもありがとうございます。　height: 295.5mm; // 297mmだと2ページ目にはみ出してしまうので微調整
2021/06/06 12:30
table
ブラウザとプリンタの動作保証とれない(確認取りたくない)のでpdf吐き出しますねー
2021/06/06 12:34
metatrading
運用と開発が一体ならこれでも良いんじゃないかなと思いますけど。修正が容易かと言うと、Excel帳票という運用側の導入ハードルの低さを超えられるかどうか。SVG帳票でぐぐると既にサービスもあるようで。
2021/06/06 12:42
ys0000
帳票系の担当は絶対にやりたくないでござる。
2021/06/06 12:43
knosa
Excelも商用ソフトもGitHubで管理できないからエンジニア的文化の深いチームや会社ならこういうアプローチの方が良いよね
2021/06/06 12:46
gachapining
帳票はよくわからないんだけど、男・女のいずれかを丸で囲んだり、いずれかの項目にチェックをつけたり、1マスに1文字入力したりみたいな単純な文字入力以外があると詰みそうな気がした。
2021/06/06 12:59
kuippa
10年ぐらい前作字が必要なレベルの特殊印刷要件はflex airで作ったけどローカルのフォントアクセスとかプリンター操作はむずい時代になったよね。FlashPlayerなくなっちゃたとはいえdll時代に戻るのはやだしwebUSBとかで..
2021/06/06 13:15
lemondm7
XD大好きだけど、こういうのはExcelに任せたほうが効率がいいのだ、、、
2021/06/06 13:18
mkusunok
帳票=PDFと頭から思い込んでたけど、こっちで十分かも
2021/06/06 13:36
tyosuke2011
すごい
2021/06/06 13:38
megane1972
人気ブコメが厳しすぎて引く。いろんな方法があれば好きに組み合わせられていいじゃない？技術も多様性が大事。Inkscapeで試してみようと思う。
2021/06/06 14:14
codingalone
面白いと思うがそもそもフォームをサーバサイドでレンダリングするような選択肢がないのが謎だな。技術力かサーバサイド言語の制約？これだと動的にフォームを生成できないね。
2021/06/06 15:02
ka-ka_xyz
個人的には、「コンテナ上でテンプレートからhtmlを生成してからpdfに変換(nodejsでEJS -> electron-pdf。仮想ディスプレイ環境が必要)」にたどり着いた。重いのだけどhtmlベースで作れてかつクライアント環境に左右されないので
2021/06/06 16:06
kiyo_hiko
へー。帳票は苦労の連続だったもんなあ
2021/06/06 16:14
ultimatebreak
ベストプラクティス警察が生まれた記事
2021/06/06 16:20
voidy21
この方法はあり！あとは拠点のプリンタごとに印刷位置調整する要件とかをすっ飛ばせるような政治力ですねぇ
2021/06/06 16:43
endo_5501
SVGをこういう用途に使うのは目新しく感じる
2021/06/06 16:52
tokuninac
株式会社ほげほげほげほげほげほげ　で笑ったw
2021/06/06 17:16
catnapper_mar
何かと帳票がついて回るB2Bサービスやってる人にはかなり参考になる知見では。
2021/06/06 17:34
frontline
今までのやり方しかわからない人にメンテ法まで教える所までどこかに委託できるならいいとおもう。問題は技術でなく人間であることの方が多いので。あ、内容は大いに賛成っす！
2021/06/06 17:41
ryu39
この記事もブコメも参考になる、ありがたい。
2021/06/06 17:41
rryu
HTMLがダメな理由が自分にスキルが無いからだった。今はflexとかもあるし全体をTABLE要素にする苦行をしなくてもできると思う。
2021/06/06 17:41
NOV1975
メモメモ／SI系ならSVFとか言うけど大量かつ大量じゃない限りあんなコスパ悪いもの使わんわ。
2021/06/06 17:47
kkobayashi
そもそも帳票をデザインしなくて良いように業務を変えることだよな
2021/06/06 17:53
northlight
まあ正直SIだと確実に動くSVFとか使っちゃうかなとは思った。この方式を誰かが担保してくれればいいんだけどね…
2021/06/06 18:10
toaruR
むかーし、FDFでやった
2021/06/06 18:57
imwks
firefoxでデモサイトみたら２ページ目が空白ページとなってた・・
2021/06/06 19:01
rarao1048
画面ではうまく出ているのに印刷時におかしくなるのはあるある。なぜ、ずれてしまうのかが、未だに分かってない。分かってないから根本解決や開発前に回避ができないのだなあと感じた
2021/06/06 19:08
nmcli
例に漏れず、Excel→PDFになった。WebアプリによってはSVGで出せるのはありがたいかも。
2021/06/06 19:23
caribou404
各ブラウザの印刷機能に依存したくないという人は、puppeteerなどでHeadless chromeを使ったpdf生成サーバをBFF的に立てるのおすすめ
2021/06/06 19:37
hiro7373
Googleスライドあたりで行けそうな気がする
2021/06/06 19:54
penult
雰囲気からしてWindowsではあんまり確認してなさそうだなと思ったら、やっぱりWindowsでは普通に商品名や型番がはみ出していた…
2021/06/06 20:38
mabushii_sign
SIでもSVFを使うのはお金がある場合だけ。こういう情報は助かる。
2021/06/06 21:46
aktkro
このやり方で複数ページにまたがる時にうまくいくのか？という気持ち。帳票SaaSのdocurain使おう。
2021/06/07 01:08
tumo300-500
帳票に使うかは置いておいて、SVG をテンプレートとして使うテクニックは使い所ありそう
2021/06/07 03:17
kibitaki
成果物に使われてる技術からしたらcolspanが苦行ってのがさっぱりわからない。
2021/06/07 08:01
seal2501
TCPDFで頑張ってたけど結局あれも地獄のコードになるので、なんらかの流し込めるもの欲しいな…SVGもアウトライン化してないからそら環境依存ある
2021/06/07 09:42
djshigy
ベストプラクティス,PDF
2021/06/07 14:06
field_combat
確かによさそう。帳票はちょっとズレてると嫌がるのをやめたらみんな幸せになれそうなのに。
2021/06/07 16:57
mas-higa
なんだよ。LaTeX で埋め込みかと思ったら違うじゃないか!
2021/06/09 01:24
smbd
すごい
2021/06/09 13:54
masayoshinym
ここに辿り着くまでに想像を超える試行錯誤の連続があったんだろうな、と思った。