`svg`定数

リファレンスの説明と例は英語です。見出しと目次は日本語です。

The flag of Pernambuco (ペルナンブーコ州), BR-PE, as an SVG string: viewBox 540 by 360 (3:2), 935 B. From Wikimedia Commons, "Bandeira de Pernambuco.svg" (public domain); the /manifest entry gives its author, licence and why it was chosen. It has a viewBox and no width or height, so it fills the box it is put in at its own aspect ratio.

インポート

import { svg } from "@johnmorrisdotca/hata/flags/br-pe";

定義

const svg: string = "<svg data-hata=\"br-pe\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 540 360\"><path fill=\"#3155a4\" d=\"M0 0h540v216H0z\"/><path stroke=\"#c34342\" stroke-width=\"12\" d=\"M69 270a129 129 202.5 0 1 402 0\" style=\"fill:none\"/><path stroke=\"#ffb511\" stroke-width=\"12\" d=\"M81 270a117 117 202.5 0 1 378 0\" style=\"fill:none\"/><path stroke=\"#00ad4a\" stroke-width=\"12\" d=\"M93 270a105 105 202.5 0 1 354 0\" style=\"fill:none\"/><path fill=\"#fff\" d=\"M0 216h540v144H0z\"/><path fill=\"none\" stroke=\"#c34342\" stroke-width=\"12\" d=\"M270 243v90m-27-58.5h54\"/><path fill=\"#ffb511\" d=\"m270 126 3 9.2 5.2-8.1.4 9.6 7.1-6.5-2 9.4 8.6-4.4-4.4 8.6 9.4-2-6.5 7 9.6.5-8 5.3 9.1 2.9-9.2 3 8.1 5.2-9.6.4 6.5 7.1-9.4-2 4.4 8.6-8.6-4.4 2 9.4-7-6.5-.5 9.6-5.3-8-2.9 9.1-3-9.2-5.2 8.1-.4-9.6-7.1 6.5 2-9.4-8.6 4.4 4.4-8.6-9.4 2 6.5-7-9.6-.5 8-5.3-9.1-2.9 9.2-3-8.1-5.2 9.6-.4-6.5-7.1 9.4 2-4.4-8.6 8.6 4.4-2-9.4 7 6.5.5-9.6 5.3 8zm0-108 8.8 27-23-16.7h28.4l-23 16.7z\"/></svg>"

例

例 1

import flag from "@johnmorrisdotca/hata/flags/br-pe";

const host=document.createElement("div");
host.innerHTML = flag; // or toDataUri(flag) from "@johnmorrisdotca/hata" for an <img src>
console.log(host.querySelector("svg")?.getAttribute("viewBox"));

例 2

import { svg } from "@johnmorrisdotca/hata/flags/br-pe";
console.log(svg.startsWith("<svg"),svg.length);

true 935

出力（このページを作ったときに実行した結果）

ソースを見る GitHub で編集@johnmorrisdotca/hata 1.6.0 のソースから作成しました。

この日本語は、まだ日本語を母語とする方の確認を受けていません。訂正を歓迎します。

svg定数

定義

例

例 1

例 2

`svg`定数