SVG - tech-notes

SVG

SVG では文字をベクター情報の領域に有することで拡大縮小した際にはアウトラインフォントで表現する

MIME 形式指定では image/svg+xml

ファイルの拡張子は .svg と gzip 圧縮された .svgz

文字情報は文字データのみを明示的にグループ化しているため、文字のグループのみを抽出することで多言語化が比較的容易

ScrapboxにSVG画像を埋め込む実験

様々なフォーマットで現在時刻の画像を返してくれるサイトを作ってみた。

SVG画像の場合

現在時刻のSVG画像を返すURL[https://clockimages.glitch.me/now.svg]をScrapboxに書いてみた。

画像といっても<svg>タグの中に<text>タグと<a>タグが入っているだけなので400バイトくらい。

https://clockimages.glitch.me/now.svg ☜現在時刻になっているはず

JPEG画像の場合

現在時刻のJPEG画像を指すURL[https://clockimages.glitch.me/now.jpg]をScrapboxに書いてみた。

https://clockimages.glitch.me/now.jpg ☜現在時刻になっているはず

JPEG画像だと3500～4000バイトくらい。

embedやiframeの代替として使えそう？

Scrapboxにはembedやiframeで外部のコンテンツを埋め込むことはできない。

YouTubeの動画へのURLは例外的に埋め込んでくれるようだが。

URLの末尾が画像っぽいのはimgタグで囲んでくれるらしい。

任意のURLのコンテンツをSVGに変換するプロキシ的なものがあれば埋め込めそう。

JPEGやPNGの画像にして埋め込むのと原理は変わらないが、データは小さくて済む。

というか、TwitterがSVGタグを生成してくれ。