SVG画像の表示サイズとコンテンツの軽微な修正

[na3shkw]

Description

• 「オリジン間リソース共有 (CORS)」のページで SVG 画像が小さく表示されてしまっている #25551 を修正しました
• 文字がはみ出さないよう、図形のサイズを調整しました

Motivation

Additional details

#25551 の修正

154713e で、<svg> 要素から width 属性を削除しました。画像が小さく表示される原因が <svg> 要素の width 属性に単位が % の値が指定されているためです。

rari ではローカル画像のサイズを取得して <img> 要素の width および height 属性の値として設定する処理が行われます。画像の幅は svg-metadata クレートを利用して取得されるメタデータを利用しています。このクレートでは width 属性値の単位が % の場合は viewBox 属性の値をもとに幅を計算する width メソッドが提供されています。しかし、rari はこのメソッドではなく Width 構造体の width の値を直接利用しているために単位が無視され、100% が 100 と解釈されてしまっています。

英語版でこの問題が起こらないのは、<img> 要素への width および height の設定をあくまで同一ホストから提供される画像に限定しているためのようです（英語版の画像は mdn.github.io でホストされています）。

rari 側の問題ですが、現時点ではコントリビューションを受け付けていないため svg を変更して対応します。この修正を適用すると viewBox 属性で指定された幅と高さが利用されます。

文字がはみ出さないような図形のサイズの調整

c1fef84 で、該当の <rect> の幅および横位置を変更しました。

Related issues and pull requests

Fixes #25551

[mfuji09]

良いと思います。ありがとうございました。