SVG

表 1 . SVG （ XML）の要素と属性

要素	属性

svg	viewBoxで、ワールド座標系を設定します。 width, heightで、html内のboxを設定しますが、レスポンシブデザインの場合は、省略するのがおすすめです。
g
symbol
clipPath	idを設定して、クリッピング領域を設定します。ネストすることもできます。その場合、fill-ruleを設定します。
path	dコマンドで図形を描画できます。ベジェ曲線 “M”は基点、開始点を示し、”C”は三次ベジェ曲線を描画する。二次ベジェ曲線：コーナーを丸めるとき使う。三次ベジェ曲線：先端を丸めるとき使う。
polygon	pointsでワールド座標系の座標を設定します。 fillでRGBを設定します。 styleで設定もできます。

表 2 . ベクター・グラフィックスとしての canvas と svg

項目	canvas	svg

画像としてダウンロード	JavaScriptで、ビットマップに描画するので、 png形式で可。	xmlの記述をブラウザがレンダリングするので直接は不可。 svgをファイルにして、パワーポイントに読み込み、png形式で保存することで可能。
クローラ／読み上げ	クローラには何が書いてあるかわらない。 Google Lensなら少しわかるかも。	xmlの記述なので、マシンリーダブル。読み上げも可能かも。

表 3 . 色

種類	RGB	HSB /HSL	CMYK

概念	加法混色光源色	色相環通信	減法混色物体色（表面色、透過色）蛍光色、金属光沢を除く
表現	Red ff0000 green 00ff00 blue 0000ff		cyan 00ffff magenta ff00ff yellow ffff00
用途	ディスプレイ HTML、CSS、 SVG	通信	印刷プリンター、カメラ
ジャンル	エネルギー	情報	材料

図 1 . ◇ 米沢市市街

V2Hとは、電気自動車の電池を、住宅の電池(ESS)にリユースすることです。電気自動車の電池容量は、 40kWh程度とすれば、住宅の電池10kWhの4世帯分に相当します。

しかし安全にリユースするには、バッテリーのインスペクションが欠かせません。

表 4 . 表現のためのファイル形式の例

図 3 . svg 形式を htmlに直接記述した山形大学のロゴ

svg 形式を htmlに直接記述した山形大学のロゴです。

山形大学のスクールカラーときわ色（プロセスカラー3色を使用し，C(シアン)＝100％，M(マゼンタ)＝60％及びY(イエロー)＝70％を割合とする色）です。#00664dになります。 http://www.colordic.org/ #00664d

この場合、svg の中でimgをロードすることもできます。 htmlが長くなって、メンテナンス性が悪くなるので、aspならサーバーサイドでincにまとめる方がいいかもしれません。