今回は「Webグラフィックス Advent Calendar 2020」に投稿した記事「SVG + CSS + Node.js + receiptline で電子レシートを発行してみよう」の補足です。

上記の記事では、作成した SVG の電子レシートを貼り付けることができず、仕方なくスクリーンショットを撮って PNG 形式で貼り付けていました。

ところが、翌日に投稿された、カレンダー作成者 warotarock さんの記事には、「動くもの」が CodePen で埋め込まれているではありませんか！

そこで、作成した SVG の電子レシート各種も CodePen でデモしてみたいと思います。

動くもの

See the Pen SVG + CSS + Node.js + receiptline = Digital Receipt by dopperi46 (@dopperi46) on CodePen.

何とかできました！
ハマりどころは、CodePen 埋め込みスクリプトの URL を変更しないと表示されないところ。

<script asyncsrc="https://production-assets.codepen.io/assets/embed/ei.js"></script>

また何か作ったら投稿します。ではまた！