[feat] QRコードをSVGでもダウンロードできるようにする - #8
Open
haruto-kamijo wants to merge 1 commit into
Open
Conversation
印刷物に置くQRコードなので、ポスターや看板のデザインデータに配置する段では 解像度非依存のベクターが要る。640pxのPNGをA1に載せれば拡大でモジュールの縁が 甘くなり、それは読み取り距離そのものに効いてくる。 既に依存している qrcode の toString がブラウザビルドでもSVGを返すので、 ライブラリの追加はしていない。QR本体はライブラリが返す完結した <svg> を x/y だけ差し込んで入れ子にする。モジュールを自前で <rect> に組み直すより、 パス生成はライブラリに任せたほうが崩れない。 版面の計算は qrImageLayout に括り出してPNGと共有した。同じ画像の別形式で あることが崩れると、片方を差し替えた側が配置をやり直すことになる。実際に 両形式を出して寸法が一致することを確認している(704x704 / 754 / 788)。 キャプションは <text> のまま出す。ベクターソフトで文字を編集できる代わりに 字形はそのマシンのフォント依存になるが、影響はキャプションだけで、コード 自体はパスなので読み取りには関わらない。ベースラインは dominant-baseline を 使わずy座標を明示計算した — 属性の解釈がソフトによって揺れる。 識別名は escapeXmlText を通す。`造形大 & 看板` は実際にありうる名前で、 素通しすれば壊れたSVGが落ちてくる。 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
印刷物に置くQRコードなので、ポスターや看板のデザインデータに配置する段では
解像度非依存のベクターが要る。640pxのPNGをA1に載せれば拡大でモジュールの縁が
甘くなり、それは読み取り距離そのものに効いてくる。
既に依存している qrcode の toString がブラウザビルドでもSVGを返すので、
ライブラリの追加はしていない。QR本体はライブラリが返す完結した を
x/y だけ差し込んで入れ子にする。モジュールを自前で に組み直すより、
パス生成はライブラリに任せたほうが崩れない。
版面の計算は qrImageLayout に括り出してPNGと共有した。同じ画像の別形式で
あることが崩れると、片方を差し替えた側が配置をやり直すことになる。実際に
両形式を出して寸法が一致することを確認している(704x704 / 754 / 788)。
キャプションは のまま出す。ベクターソフトで文字を編集できる代わりに
字形はそのマシンのフォント依存になるが、影響はキャプションだけで、コード
自体はパスなので読み取りには関わらない。ベースラインは dominant-baseline を
使わずy座標を明示計算した — 属性の解釈がソフトによって揺れる。
識別名は escapeXmlText を通す。
造形大 & 看板は実際にありうる名前で、素通しすれば壊れたSVGが落ちてくる。
What & why
How this was tested
pnpm lintpnpm typecheckpnpm buildwrangler devScreenshots (if UI change)