svg定数
リファレンスの説明と例は英語です。見出しと目次は日本語です。
The flag of Mongolia (モンゴル), MN, as an SVG string: viewBox 1200 by 600 (2:1), 1.2 KB. From Wikimedia Commons, "Flag of Mongolia.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/mn";
定義
const svg: string = "<svg data-hata=\"mn\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"#ffd300\" viewBox=\"0 0 1200 600\"><path fill=\"#da2031\" d=\"M0 0h1200v600H0z\"/><path fill=\"#0066b2\" d=\"M400 0h400v600H400z\"/><circle cx=\"200\" cy=\"205\" r=\"55\"/><circle cx=\"200\" cy=\"180\" r=\"60\" fill=\"#da2031\"/><circle cx=\"200\" cy=\"190\" r=\"40\"/><path d=\"M204.2 60a12 12 0 0 0-7.2 10.4c-.3 3.4 1.2 7.2 1.4 10.6 0 5.7-6 7.6-6 15.8 0 2.8 2.6 5.9 2.6 13.2-.4 3.8-2.5 4.7-5 5a5 5 0 0 1-5-5 5 5 0 0 1 1.4-3.4l.5-.5c1.2-1.2 2.7-1.6 2.7-4.7 0-1.5-1-3-2-5.7s-.2-7.2 2-9.8c-3.5 1.3-5.7 4.7-6.8 7.7-1.1 3.7-.1 5.8-1.7 8.9-1 2-2.1 2.8-3.2 4.5a19 19 0 0 0-2.9 8 25 25 0 0 0 50 0c0-2-1.5-6.2-2.8-8-1-1.7-2.2-2.5-3.2-4.5-1.6-3-.6-5.2-1.7-8.9-1.1-3-3.3-6.4-6.8-7.7 2.2 2.6 2.9 7.1 2 9.8-1 2.7-2 4.2-2 5.7 0 3 1.5 3.5 2.6 4.7l.6.5a5 5 0 0 1 1.3 3.4 5 5 0 0 1-5 5c-2.7-.4-4.7-1.6-5-5 0-9.6 4.2-10.2 4.2-17.4 0-10.1-9.2-15-9.2-22.4 0-2.5.6-6.8 4.2-10.2M90 270h50v240H90zm170 0h50v240h-50zm-110 0h100l-50 30zm0 40h100v20H150zm0 140h100v20H150zm0 30h100l-50 30z\"/><circle cx=\"200\" cy=\"390\" r=\"50\"/><g fill=\"#da2032\"><circle cx=\"200\" cy=\"363.5\" r=\"10\"/><circle cx=\"200\" cy=\"416.5\" r=\"10\"/><path d=\"M200 334a29.5 29.5 0 0 1 0 59 23.5 23.5 0 0 0 0 47v6a29.5 29.5 0 0 1 0-59 23.5 23.5 0 0 0 0-47z\"/></g></svg>"
例
例 1
import flag from "@johnmorrisdotca/hata/flags/mn";
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/mn";
console.log(svg.startsWith("<svg"),svg.length);true 1238出力(このページを作ったときに実行した結果)
この日本語は、まだ日本語を母語とする方の確認を受けていません。訂正を歓迎します。