SVG
SVG
ファイル名拡張子.svg、.svgz
インターネットメディアの種類image/svg+xml[ 1 ] [ 2 ]
統一型識別子（UTI）public.svg-image
開発者W3C
初回リリース2001年9月4日 （2001年9月4日）
最新リリース
1.1（第2版）2011年8月16日 （2011年8月16日）
フォーマットの種類ベクターグラフィック
延長からXML
標準W3C SVG
オープンフォーマット?はい
Webサイトwww .w3 .org /グラフィックス/SVG /

Scalable Vector Graphics（SVG）は、XMLベースのベクターグラフィック形式で、 2次元グラフィックを定義するためのフォーマットです。インタラクティブ機能やアニメーション機能もサポートされています。SVG仕様は、1999年からWorld Wide Web Consortium（W3C）によって策定されているオープンスタンダードです。

SVG画像はベクターグラフィック形式で定義され、XMLテキストファイルに保存されます。そのため、SVG画像は画質を損なうことなくサイズを拡大縮小でき、検索、インデックス作成、スクリプト化、圧縮が可能です。XMLテキストファイルはテキストエディタまたはベクターグラフィックエディタで作成・編集でき、ほとんどのWebブラウザでレンダリングできます。SVGにはJavaScriptが含まれる場合があり、クロスサイトスクリプティングを引き起こす可能性があります。

歴史

SVGは、1998年に6つの競合するベクターグラフィックス言語の提案がコンソーシアムに提出された後、1999年からワールドワイドウェブコンソーシアム（W3C）内で開発が進められています（下記参照）。 [ 3 ]

初期のSVGワーキンググループは、商用の提案を一切開発せず、それらの提案を参考にはするが、実際にはそれらに基づいていない新しいマークアップ言語を作成することを決定しました。 [ 3 ]

SVG は、1998 年に 6 つの競合するベクター グラフィックスの提案が提出された後、 W3C SVG ワーキング グループによって開発されました。

当時、このワーキンググループの議長はW3C の Chris Lilley氏が務めていた。

初期の導入は、Internet Explorerの古いバージョンでサポートされていなかったため、限られていました。しかし、2011年には、主要なデスクトップブラウザすべてがSVGのサポートを開始しました。ブラウザのネイティブサポートには、プラグインが不要であること、SVGを他のコンテンツと混在させることができること、レンダリングとスクリプトの信頼性が向上することなど、様々な利点があります。モバイルSVGのサポートは様々な形で提供されており、様々なデバイスやブラウザがSVG Tiny 1.1または1.2をサポートしています。SVGはベクターグラフィックエディタを使用して作成し、ラスター形式にレンダリングできます。Webベースのアプリケーションでは、インラインSVGを使用してHTMLドキュメント内にSVGコンテンツを埋め込むことができます。

SVG仕様は2011年にバージョン1.1に更新されました。Scalable Vector Graphics 2は2016年9月15日にW3Cの候補勧告となりました。SVG 2には、SVG 1.1とSVG Tiny 1.2の機能に加えて、いくつかの新機能が組み込まれています。[ 9 ]

バージョン 1.x

  • SVG 1.0は2001年9月4日にW3C勧告となった。 [ 10 ]
  • SVG 1.1は2003年1月14日にW3C勧告となりました。[ 11 ] SVG 1.1仕様はモジュール化されており、サブセットをプロファイルとして定義することができます。この点を除けば、SVG 1.1とSVG 1.0の間にはほとんど違いはありません。
    • SVG TinyとSVG Basic（モバイルSVGプロファイル）は2003年1月14日にW3C勧告となった。これらはSVG 1.1のプロファイルとして説明されている。[ 12 ]
  • SVG Tiny 1.2は2008年12月22日にW3C勧告となった。[ 13 ]当初は計画されていたSVG Full 1.2（後にSVG 2に置き換えられた）のプロファイルとして起草されたが、[ 14 ]後に独立した仕様としてリファクタリングされた。サポートは概して不十分である。
  • SVG 1.1第2版は、元のSVG 1.1に対するすべてのエラッタと明確化が含まれていますが、新しい機能は含まれていません。2011年8月16日にリリースされました。[ 15 ]
  • SVG Tiny 1.2 Portable/Secureは、2020年7月29日にIETF標準草案として導入されたSVG Tiny 1.2プロファイルのより安全なサブセットです。[ 16 ] SVG Tiny P/Sとも呼ばれます。SVG Tiny 1.2 Portable/SecureはBIMI標準草案の要件です。 [ 17 ]

バージョン2

SVG 2ではSVG 1.1の一部の機能が削除または廃止され、HTML5とWeb Open Font Format（WOFF）の新機能が組み込まれています。[ 18 ]

  • たとえば、SVG 2 では、glyphやなどのいくつかのフォント要素が削除されますaltGlyph(WOFF に置き換えられました)。
  • このxml:space属性は CSS に置き換えられたため非推奨です。
  • translate属性などの HTML5 機能data-*が追加されました。
  • SVG Tiny 1.2のテキスト処理機能は含まれるように注釈が付けられていますが、まだテキストでは正式化されていません。[ 19 ]他のいくつかの1.2の機能は厳選されていますが[ 18 ]、SVG 2は一般にSVG tiny 1.2のスーパーセットではありません。

SVG 2は2016年9月15日に候補勧告段階に達し、[ 20 ]改訂版は2018年8月7日と2018年10月4日に公開されました。[ 21 ]最新の草案は2025年9月14日にリリースされました。[ 22 ]

特徴

この画像はビットマップ画像とベクター画像の違いを示しています。ビットマップ画像は固定されたピクセルの集合で構成され、ベクター画像は固定された形状の集合で構成されています。この画像では、ビットマップ画像を拡大するとピクセルが見えるのに対し、ベクター画像を拡大すると形状が維持されます。

SVGはインタラクティブ性、アニメーション、そして豊富なグラフィック機能をサポートしており、Webアプリケーションと印刷アプリケーションの両方に適しています。SVG画像はgzipアルゴリズムで圧縮でき、SVGZファイルは元のファイルより通常20～50%サイズが小さくなります。また、SVGはメタデータもサポートしているため、SVGコンテンツのインデックス作成、検索、取得が容易になります。

SVGでは、ベクターグラフィックシェイプ（直線や曲線で構成されるパスなど）、ビットマップ画像、テキストの3種類のグラフィックオブジェクトを使用できます。グラフィックオブジェクトは、グループ化、スタイル設定、変換、および既にレンダリングされたオブジェクトとの合成が可能です。機能セットには、ネストされた変換、クリッピングパス、アルファマスク、フィルター効果、テンプレートオブジェクトが含まれます。SVG描画はインタラクティブであり、 SVG XML要素またはSVGドキュメントオブジェクトモデル（DOM） にアクセスするスクリプトで定義されたアニメーションを含めることができます。

SVGは、スタイル設定にCSS、スクリプト記述にJavaScriptを使用します。国際化やローカリゼーションを含むテキストは、SVG DOM内でプレーンテキストとして表示されるため、SVGグラフィックスのアクセシビリティが向上します。 [ 15 ]

印刷

SVG仕様は主にベクターグラフィックマークアップ言語（VGA）に焦点を当てていますが、その設計にはAdobe PDFのようなページ記述言語（PDL）の基本的な機能も含まれています。リッチグラフィックのための規定が含まれており、スタイル設定のためにCSSと互換性があります。SVGは、各グリフと画像を印刷ページ上の指定された位置に配置するのに必要な情報を持っています。[ 23 ]

スクリプトとアニメーション

SVG描画は動的かつインタラクティブです。要素の時間ベースの変更はSMILで記述するか、スクリプト言語（例：JavaScript）でプログラムすることができます。W3Cは、SVGアニメーションの標準としてSMILを明示的に推奨しています。[ 24 ]

「onmouseover」や「onclick」などの豊富なイベント ハンドラーセットを任意の SVG グラフィカル オブジェクトに割り当てて、アクションやイベントを適用できます。

モバイルプロフィール

業界の要望により、SVG 1.1 ではSVG Tiny (SVGT) とSVG Basic (SVGB) の 2 つのモバイル プロファイルが導入されました。

これらは完全なSVG標準のサブセットであり、主に機能が制限されたユーザーエージェントを対象としています。特に、SVG Tinyは携帯電話などの機能制限の厳しいモバイルデバイス向けに定義されており、スタイルやスクリプトをサポートしていません。[ 25 ] SVG Basicはスマートフォンなどの高機能モバイルデバイス向けに定義されています。

2003年、国際電気通信標準化団体3GPPは、次世代携帯電話の必須ベクターグラフィックメディアフォーマットとしてSVG Tinyを採用しました。SVGTは必須ベクターグラフィックフォーマットであり、SVGBのサポートはマルチメディアメッセージングサービス（MMS）とパケット交換ストリーミングサービスではオプションです。[ 26 ] [ 27 ] [ 28 ]その後、3GPP IPマルチメディアサブシステム（IMS）のベクターグラフィックスの必須フォーマットとして追加されました。[ 29 ]

どちらのモバイルプロファイルも完全なドキュメントオブジェクトモデル（DOM）のサポートは含まれていませんが、SVG Basicのみがスクリプトのオプションサポートを提供しています。しかし、これらは完全な標準の完全に互換性のあるサブセットであるため、ほとんどのSVGグラフィックはモバイルプロファイルのみをサポートするデバイスでもレンダリングできます。[ 30 ]

SVGT 1.2では、microDOM（μDOM）、スタイル、スクリプト機能が追加されました。[ 25 ] SVGT 1.2には、Opera、Firefox、WebKitなどの一部のSVG 1.1実装でサポートされている非スケーリングストロークなど、SVG 1.1にはない機能もいくつか含まれています。デスクトップブラウザとモバイルブラウザ間でコードベースを共有するケースが増えるにつれて、SVGT 1.2よりもSVG 1.1の利用も増加しました。

圧縮

SVG画像はXMLであるため、多くのテキスト断片が繰り返されるため、ロスレスデータ圧縮アルゴリズムに適しています。SVG画像がgzipアルゴリズムで圧縮されている場合、それは「SVGZ」画像と呼ばれ、対応する.svgzファイル名拡張子が付けられます。SVG 1.1に準拠したビューアは圧縮された画像を表示します。[ 31 ] SVGZファイルは通常、元のサイズの20～50%になります。[ 32 ] W3Cは、準拠性をテストするためにSVGZファイルを提供しています。[ 33 ]

デザイン

SVG 1.1仕様では14の機能領域または機能セットが定義されている: [ 11 ]

パス
単純または複合図形のアウトラインは、曲線または直線で描画され、塗りつぶしたり、アウトラインを描いたり、クリッピングパスとして使用したりできます。パスはコンパクトなコーディングです。
例えば、M（「move to」の場合）は、最初の数値x座標とy座標 の前に付き、L（「line to」の場合）は、直線を描くべき点の前に付きます。さらに、コマンド文字（C、S、Q、T、 ）は、様々なベジェ曲線や楕円A曲線を描くために使用されるデータの前に付きます。はパスを閉じるために使用されます。Z
いずれの場合も、大文字のコマンドの後に絶対座標が続き、小文字のコマンドの後に相対座標が使用されます。[ 34 ]
基本的な形状
直線パス、連続した直線セグメント（ポリライン）で構成されるパス、閉じた多角形、円、楕円を描くことができます。長方形と角丸長方形も標準的な要素です。[ 35 ]
文章
SVGファイルに含まれるUnicode文字テキストは、XML文字データとして表現されます。様々な視覚効果が可能であり、SVG仕様は双方向テキスト（例えば、英語とアラビア語のテキストの組み合わせ）、縦書きテキスト（中国語や日本語の表記など）、曲線パスに沿った文字（例えば、アメリカ合衆国国璽の縁のテキスト）を自動的に処理します。[ 36 ]
絵画
SVGシェイプは塗りつぶしたり、アウトライン（色、グラデーション、パターンで描画）したりできます。塗りつぶしは不透明にすることも、任意の透明度にすることもできます。
「マーカー」とは、矢印や多角形の頂点に表示される記号などの線の端点のことです。[ 37 ]
色
fill色は、すべての表示可能なSVG要素に直接、または、 、その他のプロパティを介して適用できます。色の指定方法はCSS2strokeと同じです。つまり、や のような名前、や のような16進数、のような10進数、のような10進数、または の形式のパーセンテージで指定します。[ 38 ]blackblue#2f0#22ff00rgb(255,255,127)rgb(100%,100%,50%)
グラデーションとパターン
SVGシェイプは、上記のように単色で塗りつぶしたり、アウトラインを描いたりできます。また、カラーグラデーションや繰り返しパターンで塗りつぶすこともできます。カラーグラデーションは線形または放射状（円形）で、任意の数の色と繰り返しパターンを使用できます。不透明度グラデーションも指定できます。パターンは、定義済みのラスターまたはベクターグラフィックオブジェクトに基づいており、任意xのy方向に繰り返して使用できます。グラデーションとパターンはアニメーション化やスクリプト化が可能です。[ 39 ]
2008年以来、SVGのプロフェッショナルユーザーの間では、グラデーションメッシュ、あるいはできれば拡散曲線のいずれかをSVG仕様に追加することが有益であるという議論が交わされてきました[ 40 ] [ 41 ]。「（拡散曲線を用いた）シンプルな表現は、非常に微妙な陰影効果さえも表現できる」[ 42 ]とされ、「拡散曲線画像は、品質とコーディング効率の両面でグラデーションメッシュに匹敵するが、作成がより簡単であり（両方のツールを使用した複数のアーティストによると）、ビットマップから完全に自動的にキャプチャできる」[ 43 ]とされています。SVG 2の現在のドラフトにはグラデーションメッシュが含まれています[ 44 ] 。
クリッピング、マスキング、合成
テキスト、パス、基本図形、およびこれらの組み合わせを含むグラフィック要素は、アウトラインとして使用でき、内側と外側の両方の領域を個別に（色、グラデーション、パターンで）ペイントできます。完全に不透明なクリッピングパスと半透明のマスクを合成し、アルファブレンディングを用いて最終画像のすべてのピクセルの色と不透明度を計算します。[ 45 ]
フィルター効果[ 46 ]
フィルター効果は、特定のソース ベクター グラフィックに適用され、変更されたビットマップ結果を生成する一連のグラフィック操作で構成されます。
インタラクティブ性
SVG画像は様々な方法でユーザーとインタラクションできます。後述するハイパーリンクに加え、SVG画像の任意の部分を、フォーカスの変更、マウスクリック、画像のスクロールやズーム、その他のポインタ、キーボード、ドキュメントイベントといったユーザーインターフェースイベントに対応させることができます。イベントハンドラは、これらのイベントに応じてアニメーションを開始、停止、または変更したり、スクリプトを実行したりすることができます。[ 47 ]
リンク
SVG画像には、 XLinkを使用して他の文書へのハイパーリンクを含めることができます。<view>要素またはフラグメント識別子を使用することで、URLから文書の表示領域を変更するSVGファイルにリンクできます。これにより、特定の領域を拡大/縮小したり、特定の要素に表示を制限したりするための特定のビューステートを作成できます。これはスプライトを作成するときに役立ちます。XLinkサポートと<use>要素を組み合わせることで、内部要素と外部要素へのリンクと再利用も可能になります。これにより、コーディング者は少ないマークアップでより多くのことを行うことができ、よりクリーンなコードを作成できます。[ 48 ]
スクリプト
SVGドキュメントのあらゆる側面は、HTMLと同様にスクリプトを用いてアクセスおよび操作できます。デフォルトのスクリプト言語はJavaScriptであり、すべてのSVG要素と属性にはドキュメントオブジェクトモデル（DOM）オブジェクトが定義されています。スクリプトは<script>要素内に格納されます。スクリプトは、必要に応じてポインタイベント、キーボードイベント、ドキュメントイベントに応じて実行できます。[ 49 ]
アニメーション
<animate>SVGコンテンツは、、、<animateMotion>などの組み込みアニメーション要素を用いてアニメーション化できます<animateColor>。ECMAScriptとスクリプト言語の組み込みタイマーを用いてDOMを操作することで、コンテンツをアニメーション化できます。SVGアニメーションは、Synchronized Multimedia Integration Language (SMIL)の現行バージョンおよび将来のバージョンと互換性を持つように設計されています。アニメーションは連続的に実行することも、ループや繰り返し再生することも、前述のようにユーザーイベントに応答することもできます。[ 50 ]
フォント
HTMLやCSSと同様に、SVG内のテキストはシステムフォントなどの外部フォントファイルを参照することがあります。SVGファイルがレンダリングされるマシンに必要なフォントファイルが存在しない場合、テキストは意図したとおりに表示されない可能性があります。この制限を克服するために、テキストをSVGフォントで表示することができます。この場合、必要なグリフはSVG内でフォントとして定義され、<text>要素から参照されます。[ 51 ]
メタデータ
W3Cのセマンティックウェブ・イニシアチブに従い、SVGでは作成者がSVGコンテンツに関するメタデータを提供することができます。主な機能は要素であり、ここで文書をダブリンコアのメタ<metadata>データプロパティ（タイトル、作成者/著者、件名、説明など）を用いて記述できます。他のメタデータスキーマも使用できます。さらに、SVGでは要素と要素が定義されており、作成者はSVG画像内にプレーンテキストによる説明文を記述することで、様々な手段によるインデックス作成、検索、取得を容易にすることができます。[ 52 ]<title><desc>

SVGドキュメントでは、図形やグラデーションなどのコンポーネントを定義し、繰り返し使用できます。SVG画像には、PNGやJPEG画像などのラスターグラフィックや、さらにSVG画像を含めることもできます。

このコードは、グリッドとラベルを除いて、画像に示されている色付きの図形を生成します。 

<?xml version="1.0" encoding="UTF-8" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width= "391" height= "391" viewBox= "-70.5 -70.5 391 391" xmlns= "http://www.w3.org/2000/svg" xmlns:xlink= "http://www.w3.org/1999/xlink" > <rect fill= "#fff" stroke= "#000" x= "-70" y= "-70" width= "390" height= "390" /> <g opacity= "0.8" > <rect x= "25" y= "25" width= "200" height= "200" fill= "lime" stroke-width= "4" stroke= "pink" /> <circle cx= "125" cy= "125" r= "75" fill= "orange" /> <polyline points= "50,150 50,200 200,200 200,100" stroke= "red" stroke-width= "4" fill= "none" /> <line x1= "50" y1= "50" x2= "200" y2= "200" stroke= "blue" stroke-width= "4" /> </g> </svg>

実装

ウェブ上でのSVGの使用は、古いバージョンのInternet Explorer （IE）でサポートされていないため制限されていました。SVG画像を提供する多くのウェブサイトは、 HTTPコンテンツネゴシエーションによって自動的に提供されるか、ユーザーが直接ファイルを選択できるようにすることで、 ラスター形式でも画像を提供しています。

ウェブブラウザ

Konquerorは、2004年2月にリリースされたバージョン3.2でSVGをサポートした最初のブラウザでした。[ 53 ] 2011年現在、すべての主要なデスクトップブラウザと多くのマイナーブラウザが、ある程度のSVGをサポートしています。他のブラウザの実装はまだ完全ではありません。詳細については、レイアウトエンジンの比較を参照してください。

Firefoxの以前のバージョン（例えば、1.5から3.6までのバージョン[ 54 ]）や、SVGグラフィックを表示できる他のいくつかの（今では時代遅れの）ウェブブラウザでは、画像をHTMLウェブページの一部として統合するのではなく、SVGをHTMLウェブページの一部として埋め込んだり、要素に<object>統合したりする必要がありました。[ 55 ]ただし、 XML名前空間を使用してSVG画像をXHTMLページに含めることができます。[ 56 ]<iframe><img>

ワールドワイドウェブの発明者であるティム・バーナーズ＝リーは、 SVGをサポートしていなかったインターネットエクスプローラの初期バージョンを批判した。[ 57 ]

ネイティブサポートと完全サポートにはいくつかの利点があります。プラグインは必要なく、SVGは単一のドキュメント内で他のコンテンツと自由に混在させることができ、レンダリングとスクリプトの信頼性が大幅に向上します。[ 67 ]

モバイルデバイス

SVGのサポートは、古いスマートフォンや機能制限のあるスマートフォンではSVGTのみに限定される場合があり、あるいはそれぞれのOSによって主に制限される場合もあります。Adobe Flash Liteはバージョン1.1以降、SVG Tinyをオプションでサポートしています。SVG Open 2005カンファレンスでは、SunがConnected Limited Device Configuration （CLDC）プラットフォーム向けのSVG Tiny 1.1のモバイル実装をデモしました。[ 68 ]

Opera MobileやiPhoneの内蔵ブラウザを搭載したモバイル端末も SVG をサポートしています。しかし、 WebKitエンジンを使用しているにもかかわらず、Androidの内蔵ブラウザはバージョン 3.0 (Honeycomb) より前は SVG をサポートしていませんでした。[ 69 ]バージョン 3.0 より前では、Android 版 Firefox Mobile 4.0b2 (ベータ版) が、Android で動作するブラウザとして初めてデフォルトで SVG をサポートしました。[ 70 ]

利用可能なSVG Tinyのサポートレベルは、インストールされているSVGエンジンに応じてモバイルごとに異なります。多くの新しいモバイル製品は、グラデーションや不透明度など、SVG Tiny 1.1を超える追加機能をサポートしています。これは「SVGT 1.1+」と呼ばれることもありますが、そのような標準規格はありません。

RIMのBlackBerryはバージョン5.0以降、SVG Tiny 1.1のサポートを組み込んでいます。[ 71 ] OS 6および7ではWebKitベースのBlackBerry Torchブラウザのサポートが継続されています。 [ 72 ]

NokiaのS60プラットフォームはSVGを内蔵しています。例えば、アイコンは通常、プラットフォームのSVGエンジンを使用してレンダリングされます。Nokiaはまた、 SVGの表示と操作のためのJava ME APIを定義するJSR 226: Scalable 2D Vector Graphics API専門家グループを主導しています。このAPIは、S60 Platform 3rd Edition Feature Pack 1以降に実装されています。[ 73 ]一部のSeries 40携帯電話（ Nokia 6280など）もSVGをサポートしています。[ 74 ]

K700以降のほとんどのSony Ericsson製携帯電話（発売日順）はSVG Tiny 1.1をサポートしています。K750以降の携帯電話は、不透明度やグラデーションなどの機能もサポートしています。Sony Ericsson Java Platform-8搭載の携帯電話はJSR 226をサポートしています。

Windows Phone はバージョン 7.5 以降で SVG をサポートしています。

SVGは、モトローラ、サムスン、LG、シーメンスモバイル/ベンキューシーメンスのさまざまなモバイルデバイスでもサポートされています。主に組み込みデバイス向けに書かれたSVGレンダリングライブラリであるeSVGは、一部のモバイルプラットフォームで利用できます。[ 75 ] [ 76 ]

オーサリング

手動でコードを入力し、ベクター グラフィック エディターを使用するだけでなく、スプレッドシート プログラムの連結機能を使用して数値セルの値とテキスト文字列を連続して結合し、完全な SVG 宣言を生成することもできます。

SVG画像は、 Inkscape、Adobe Illustrator、Adobe Animate、CorelDRAWなどのベクターグラフィックエディタを用いて手動でコーディングしたり、作成したりすることができ、同じソフトウェアを用いてPNGなどの一般的なラスター画像形式にレンダリングすることもできます。さらに、 InkscapeやBoxy SVGなどのエディタには、 potrace、[ 77 ] autotrace、imagetracerjsなどの画像トレースバックエンドを用いてラスター画像をベジェ曲線にトレースするためのツールが用意されています。

2000年からGNOMEで使用されているlibrsvgや、2020年から軽量システム向けに使用されているBatikやThorVGなどのライブラリを使用することで、SVG画像をレンダリングするようにソフトウェアをプログラムできます。また、SVG画像は、無料のコマンドラインユーティリティであるImageMagick（これも内部的にlibrsvgを使用しています）を 使用することで、任意の一般的な画像形式にレンダリングできます。

ウェブベースのアプリケーションでは、インラインSVGと呼ばれる使用方法により、<svg>タグを用いてSVGコンテンツをHTMLドキュメント内に埋め込むことができます。SVGとHTMLはコンテキスト、イベント処理、CSSを共有しているため、そのグラフィカル機能を利用して洗練されたユーザーインターフェースを作成できます。

SVGのその他の用途としては、ワードプロセッサ（ LibreOfficeなど）やデスクトップパブリッシング（Scribusなど）への埋め込み、グラフの描画（gnuplotなど）、パスのインポート（ GIMPやBlenderなどでの使用など）などが挙げられます。Microsoft 365とMicrosoft Office 2019のアプリケーションサービスは、 SVG画像のエクスポート、 [ 78 ]インポート、編集をサポートしています。Appleが使用するSVGのUniform Type Identifier （UTI ）は、およびに準拠しています。 public.svg-imagepublic.imagepublic.xml

安全

HTML文書と同様に、SVGは文書フォーマットとしてスクリプトやCSSをホストすることができます。これは、攻撃者がプロフィール写真などのSVGファイルをウェブサイトにアップロードし、そのファイルが通常の画像として扱われるが、悪意のあるコンテンツが含まれている場合に問題となります。[ 79 ]例えば、SVGファイルがCSS背景画像、ウェブサイトのロゴ、または画像ギャラリーとして配置されている場合、その画像がブラウザに読み込まれると、スクリプトやその他のコンテンツがアクティブになります。これはブラウザをロックする可能性があります（Billion aughs攻撃）だけでなく、 HTMLインジェクション攻撃やクロスサイトスクリプティング攻撃につながる可能性もあります。そのため、W3CはSVGを画像のみに使用する場合の特定の要件を規定しています。SVGセキュリティ[ 80 ]

W3Cによれば、インラインSVG（ウェブサイトにネイティブにロードされるSVGファイル）は、コンテンツがより大きな文書の一部であるため、スクリプトやCSSが予期せぬものではなく、セキュリティリスクが低いと考えられています。[ 80 ]

MPEG -4 Part 20標準 –軽量アプリケーションシーン表現 (LASeR) およびシンプル集約形式 (SAF)は、SVG Tiny に基づいています。[ 81 ]これはMPEG ( ISO/IEC JTC 1 /SC29/WG11)によって開発され、 ISO/IEC 14496-20:2006 として発行されました。[ 82 ] SVG の機能は、動的な更新、バイナリエンコーディング、最先端のフォント表現など、モバイルサービス向けの重要な機能によって MPEG-4 Part 20 で強化されています。[ 83 ] SVG は、MPEG-4 Part 11のExtensible MPEG-4 Textual (XMT) 形式( XMLを使用した MPEG-4 マルチメディアコンテンツのテキスト表現)でも採用されています。[ 84 ]

参照

参考文献

  1. ^ 「image/svg+xmlのメディアタイプ登録」 W3C。2014年2月19日時点のオリジナルよりアーカイブ。2014年2月5日閲覧。
  2. ^ St. Laurent, Simon; Makoto, Murata; Kohn, Dan (2001年1月). XMLメディアタイプ. ネットワークワーキンググループ. doi : 10.17487/RFC3023 . RFC 3023 .提案された標準。8.19節。RFC 7303により廃止。RFC 6839により更新。RFC 2376を廃止。RFC 2048を更新。    
  3. ^ a b c「SVGの秘密の起源」。ワールド・ワイド・ウェブ・コンソーシアム。2007年12月21日。2020年12月24日時点のオリジナルよりアーカイブ。2011年1月1日閲覧。
  4. ^ “Schematic Graphics” . W3C . 2022年1月31日時点のオリジナルよりアーカイブ。2019年7月19日閲覧。
  5. ^ Al-Shamma, Nabeel; Robert Ayers; Richard Cohn; Jon Ferraiolo; Martin Newell; Roger K. de Bry; Kevin McCluskey; Jerry Evans (1998年4月10日). “Precision Graphics Markup Language (PGML)” . W3C . 2021年12月16日時点のオリジナルよりアーカイブ。 2009年5月8日閲覧。
  6. ^ Mathews, Brian; Brian Dister; John Bowler; Howard Cooper stein; Ajay Jindal; Tuan Nguyen; Peter Wu; Troy Sandal (1998年5月13日). “Vector Markup Language (VML)” . W3C . 2021年11月6日時点のオリジナルよりアーカイブ。 2009年5月8日閲覧。
  7. ^ “Hyper Graphics Markup Language (HGML)” . W3C . 2022年4月7日時点のオリジナルよりアーカイブ。 2019年7月19日閲覧。
  8. ^ "WebCGM Profile" . xml.coverpages.org . 2022年8月14日時点のオリジナルよりアーカイブ。2019年3月4日閲覧。
  9. ^ 「Scalable Vector Graphics (SVG) 2」 . W3C. 2017年1月27日時点のオリジナルよりアーカイブ。2017年1月28日閲覧。
  10. ^ Ferraiolo, Jon (2001年9月4日). 「Scalable Vector Graphics (SVG) 1.0仕様」 . World Wide Web Consortium. 2008年5月11日時点のオリジナルよりアーカイブ。2010年2月24日閲覧。
  11. ^ a b Ferraiolo, Jon (2011年8月16日). 「Scalable Vector Graphics (SVG) 1.1仕様」 . World Wide Web Consortium. 2012年9月16日時点のオリジナルよりアーカイブ。 2016年4月14日閲覧。
  12. ^ Capin, Tolga (2009年6月15日). 「モバイルSVGプロファイル：SVG TinyとSVG Basic」 . World Wide Web Consortium. 2010年10月9日時点のオリジナルよりアーカイブ。2010年10月24日閲覧。
  13. ^ Andersson, Ola (2008年12月22日). 「Scalable Vector Graphics (SVG) Tiny 1.2仕様」 . World Wide Web Consortium. 2020年12月7日時点のオリジナルよりアーカイブ。2010年2月24日閲覧。
  14. ^ Dengler, Patrick (2010年7月8日). 「SVG 2.0への道: SVGワーキンググループFace-to-Faceレポート (2010年5月24日～6月1日)」 . Microsoft Developer Network . Microsoft . 2016年5月12日時点のオリジナルよりアーカイブ。 2010年8月26日閲覧。
  15. ^ a b「Scalable Vector Graphics (SVG) 1.1 (Second Edition)」 . W3C. 2011年9月24日時点のオリジナルよりアーカイブ。 2011年8月29日閲覧。
  16. ^ Brotman, Alex; Adams, J. Trent (2020年7月29日). 「SVG Tiny Portable/Secure」 . Ietf Datatracker . 2021年2月14日時点のオリジナルよりアーカイブ。2021年2月9日閲覧。
  17. ^ 「実装ガイド」 . BIMIグループ. 2021年2月28日時点のオリジナルよりアーカイブ。 2021年2月9日閲覧。
  18. ^ a b「付録K：SVG 1.1からの変更点」。ワールドワイドウェブコンソーシアム。2020年5月26日。2021年2月4日時点のオリジナルよりアーカイブ。 2020年12月31日閲覧。
  19. ^ 「第11章 テキスト」。ワールド・ワイド・ウェブ・コンソーシアム。2020年5月26日。2021年4月21日時点のオリジナルよりアーカイブ。 2020年12月31日閲覧。
  20. ^ “Scalable Vector Graphics (SVG) 2” . World Wide Web Consortium. 2016年9月15日. 2021年9月9日時点のオリジナルよりアーカイブ。 2021年8月17日閲覧。
  21. ^ 「Scalable Vector Graphics (SVG) 2」。ワールド・ワイド・ウェブ・コンソーシアム。2018年10月4日。2021年7月19日時点のオリジナルよりアーカイブ。 2021年8月17日閲覧。
  22. ^ “Scalable Vector Graphics (SVG) 2” . World Wide Web Consortium. 2025年9月14日. 2021年2月10日時点のオリジナルよりアーカイブ。 2024年1月7日閲覧。
  23. ^ Alex, Danilo; Fujisawa, Jun (2002). 「ページ記述言語としてのSVG」 . svgopen.org. 2010年5月29日時点のオリジナルよりアーカイブ。2010年2月24日閲覧。
  24. ^ Paul, Festa (2003年1月9日). 「W3Cがスクリプト標準をリリース、注意点あり」 . CNet . 2011年5月17日時点のオリジナルよりアーカイブ。2010年2月24日閲覧。
  25. ^ a b「SVG Tiny 1.2」。Scalable Vector Graphics (SVG) Tiny 1.2仕様。W3C 。2008年12月22日。2014年1月30日時点のオリジナルよりアーカイブ。 2014年3月5日閲覧。
  26. ^ 「3GPPマルチメディアメッセージングおよびストリーミングサービスにおけるSVG（2003年3月版）」。SVG Open。​​2003年。2009年6月26日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  27. ^ 「3GPP マルチメディアメッセージングサービス（MMS）; メディアフォーマットおよびコーデック（リリース5）; 3GPP TS 26.140 V5.2.0（2002-12）; 技術仕様」（圧縮ドキュメント） 3GPP 2003年1月2日。 2007年2月8日時点のオリジナルよりアーカイブ。 2010年2月25日閲覧。
  28. ^ 「第3世代パートナーシッププロジェクト; 技術仕様グループサービスおよびシステム側面; マルチメディアメッセージングサービス (MMS); メディアフォーマットおよびコーデック (リリース5)」(圧縮ドキュメント) . 3GPP TS 26.140 V5.2.0 (2002-12) . 3GPP . 2003年3月. 2007年2月12日時点のオリジナルよりアーカイブ。 2010年2月24日閲覧。
  29. ^ 「3GPP仕様詳細 - 3GPP TS 26.141: IPマルチメディアシステム（IMS）メッセージングおよびプレゼンス; メディアフォーマットおよびコーデック」。3GPP。2009年12月10日。 2008年10月7日時点のオリジナルよりアーカイブ。 2010年2月24日閲覧。
  30. ^ 「SVGをサポートする携帯電話の一覧」 Svg.org。2010年1月8日時点のオリジナルよりアーカイブ。2010年10月24日閲覧。
  31. ^ www .w3 .org /TR /SVG11 /conform .html #ConformingSVGViewersには、「SVG 実装は、あらゆるコンテンツ タイプ (SVG、スクリプト ファイル、画像を含む) について、gzip エンコード [ RFC 1952 ] および deflate エンコード [ RFC 1951 ] データ ストリームを正しくサポートする必要があります」と記載されています。  
  32. ^ 「圧縮SVG（SVGZ）の保存」SVG Zone . Adob​​e Systems . 2009年7月14日. 2010年6月1日時点のオリジナルよりアーカイブ。 2010年2月24日閲覧。
  33. ^例えば、 dev .w3 .org /SVG /profiles /1 .1F2 /test /harness /htmlObject /conform-viewers-01-t .html
  34. ^ 「SVG仕様」、「パス」「 . World Wide Web Consortium. 2003年1月14日. 2012年6月21日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  35. ^ 「SVG仕様、「基本図形」「 . World Wide Web Consortium. 2003年1月14日. 2009年10月2日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  36. ^ 「SVG仕様」、「テキスト」「 . World Wide Web Consortium. 2003年1月14日. 2009年10月6日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  37. ^ 「SVG仕様、「ペイント：塗りつぶし、ストローク、マーカーシンボル」「 . World Wide Web Consortium. 2003年1月14日. 2009年9月17日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  38. ^ 「SVG仕様、「カラー」「 . World Wide Web Consortium. 2003年1月14日. 2009年9月7日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  39. ^ 「SVG仕様、「グラデーションとパターン」「 . World Wide Web Consortium. 2003年1月14日. 2009年9月21日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  40. ^ 「2008年11月17日のSVGのIRCログ」。W3C。2008年。2016年10月10日時点のオリジナルからアーカイブ。 2009年5月25日閲覧。DS ：優先事項はレイアウト、拡散曲線、2.5D、そしてCSSとの連携です。
  41. ^ 「次期SVG仕様への提案」。W3C。2009年3月16日。2011年5月14日時点のオリジナルからのアーカイブ。 2009年5月25日閲覧。実際、次期バージョンではSVGに新しいグラデーション機能を追加する予定で、拡散曲線を検討しています。これは皆さんのニーズを満たすものだと思います… *拡散曲線*は本当に素晴らしいアイデアだと思います。
  42. ^ Rusin, Zack (2008). 「KDEにおけるSVG：美の自由」 . SVG Open. 2009年7月22日時点のオリジナルよりアーカイブ。 2009年5月25日閲覧。
  43. ^ Orzan, Alexandrina; Bousseau, Adrien; Winnemöller, Holger; Barla, Pascal; Thollot, Joëlle; Salesin, David (2008). 「拡散曲線：スムーズシェーディング画像のベクトル表現」（PDF） . ACM Transactions on Graphics . 27. doi : 10.1145/1360612.1360691 . 2009年6月18日時点のオリジナルよりアーカイブ（PDF） . 2009年5月25日閲覧。
  44. ^ 「Scalable Vector Graphics (SVG) 2、W3C編集者草案、2013年6月13日」。SVG WG、2013年。2013年12月4日時点のオリジナルよりアーカイブ。 2013年9月17日閲覧。
  45. ^ 「SVG仕様、「クリッピング、マスキング、合成」「 . World Wide Web Consortium. 2003年1月14日. 2009年12月1日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  46. ^ 「SVG仕様、「フィルター効果」「 . World Wide Web Consortium. 2003年1月14日. 2006年8月28日時点のオリジナルよりアーカイブ。2009年10月19日閲覧。
  47. ^ 「SVG仕様、「インタラクティブ性」「 . ワールドワイドウェブコンソーシアム. 2003年1月14日. 2019年7月5日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  48. ^ 「SVG仕様」、「スクリプティング」「 . World Wide Web Consortium. 2003年1月14日. 2009年10月1日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  49. ^ 「SVG仕様」、「アニメーション」「 . World Wide Web Consortium. 2003年1月14日. 2006年8月27日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  50. ^ 「SVG仕様」、「フォント」「 . World Wide Web Consortium. 2003年1月14日. 2009年9月26日時点のオリジナルよりアーカイブ。 2009年10月19日閲覧。
  51. ^ 「SVG仕様」、「メタデータ」「 . ワールドワイドウェブコンソーシアム. 2009年5月3日時点のオリジナルよりアーカイブ。2009年10月19日閲覧。
  52. ^ Streichardt, Andreas (2003年9月16日). 「KDE、KSVGでベクターを制覇」 . KDEニュース. 2023年6月30日時点のオリジナルよりアーカイブ。 2012年2月11日閲覧。
  53. ^ 「Bug 276431 - 外部SVGがimgタグから読み込まれない」 Mozilla。2012年10月24日時点のオリジナルよりアーカイブ。 2011年11月9日閲覧。
  54. ^ Lusotec (2009年2月25日). 「SVG画像がFirefoxで表示されない」 . mozilla.dev.tech.svg . Googleグループ. 2011年5月14日時点のオリジナルよりアーカイブ。2010年2月25日閲覧。
  55. ^ Brettz9 (2008年8月25日). 「SVG In HTML Introduction」 . Mozilla Developer Center . Mozilla . 2008年12月5日時点のオリジナルよりアーカイブ。 2010年2月25日閲覧。
  56. ^ Svensson, Peter (2008年9月10日). 「Webの創始者がInternet Explorerの欠陥を発見」 . NBCニュース. Associated Press. 2013年11月9日時点のオリジナルよりアーカイブ。 2010年2月25日閲覧。
  57. ^ 「FirefoxのSVG」 Mozilla Developer Center、Mozilla 、2009年10月23日。 2008年6月23日時点のオリジナルよりアーカイブ。 2010年2月25日閲覧。
  58. ^ “Mozilla SVG Status” . Mozilla . 2010年3月5日時点のオリジナルよりアーカイブ。2010年2月25日閲覧。
  59. ^ Mgjbot (2008年1月15日). 「Firefox 3におけるSVGの改善」 . Mozilla Developer Center . Mozilla . 2014年2月9日時点のオリジナルよりアーカイブ。2010年2月25日閲覧。
  60. ^ "WebKit SVG Status" . WebKit . 2010年1月5日. 2010年2月10日時点のオリジナルよりアーカイブ。 2010年2月25日閲覧。
  61. ^ 「Windows Internet Explorer 8 Expert Zone Chat (2008年6月19日)」。Microsoft。2008年6月19日。2010年3月17日時点のオリジナルよりアーカイブ。 2010年10月24日閲覧。
  62. ^ Schiller, Jeff (2010年2月13日). 「SVGサポート」 . 2009年2月16日時点のオリジナルよりアーカイブ。2010年2月25日閲覧。
  63. ^ 「Internet Explorer 9 の新機能」。Microsoft Developer Network。Microsoft。2011年3月22日。2011年4月5日時点のオリジナルよりアーカイブ。 2011年3月22日閲覧。
  64. ^ "SVG (Windows)" . Internet Explorer Dev Center . Microsoft . 2014年3月20日時点のオリジナルよりアーカイブ。 2014年8月27日閲覧。
  65. ^ 「Microsoft Edge Web プラットフォームの機能の現状とロードマップ - Microsoft Edge 開発」developer.microsoft.com。2018年4月15日時点のオリジナルよりアーカイブ。2018年4月19日閲覧。
  66. ^ 「プラグインフリーのブラウジングに備えよう」 MSDN 2014年。2014年12月31日時点のオリジナルよりアーカイブ。 2014年3月5日閲覧。
  67. ^ 「SVG Open 2005 Conference and Exhibition - Proceedings - Cartoon Oriented User Interfaces」 . svgopen.org. 2010年12月3日時点のオリジナルよりアーカイブ。2010年8月29日閲覧。
  68. ^ 「ブラウザがSVG画像をレンダリングしない」。2011年5月20日時点のオリジナルよりアーカイブ。2011年1月1日閲覧。
  69. ^ 「Android版Firefox Mobile 4.0b2（ベータ版）はSVG画像をサポートします」。Android Issue 1376。2010年12月16日。2014年8月21日時点のオリジナルよりアーカイブ。 2014年1月29日閲覧。
  70. ^ 「SVGのサポート」 RIM。2011年10月10日時点のオリジナルよりアーカイブ。2011年10月6日閲覧。
  71. ^ 「BlackBerry Torch The HTML5 Developer Scorecard」 . Sencha . 2014年3月5日時点のオリジナルよりアーカイブ。 2011年10月6日閲覧。
  72. ^ 「S60 製品情報」 S60.com。2007年10月13日時点のオリジナルよりアーカイブ。2009年10月19日閲覧。
  73. ^ 「Nokia、世界最高規模のモバイル開発プラットフォーム向けシリーズ40第6版ソフトウェア開発キットをリリース」 www.fieldtechnologiesonline.com . 2025年6月12日閲覧。
  74. ^ Jezic, Damir (2002年7月15～17日). 「組み込みシステム向けSVG」チューリッヒ2002年svgopen.org. 2012年3月16日時点のオリジナルよりアーカイブ。 2012年4月5日閲覧。
  75. ^ "eSVG" . Intesis Intelligent Embedded Software . 2010年. 2012年3月3日時点のオリジナルよりアーカイブ。2014年1月29日閲覧。
  76. ^ Selinger, Peter (2001–2013). 「Potrace – ビットマップをベクターグラフィックに変換する」 . SourceForgeプロジェクトPotrace . 2009年9月9日時点のオリジナルよりアーカイブ。 2014年1月29日閲覧。
  77. ^ 「Microsoft 365 の PowerPoint の新機能」 . support.microsoft.com . 2019年9月. 2021年3月13日時点のオリジナルよりアーカイブ。 2021年4月17日閲覧。
  78. ^ Nguyen, Thanh Nguyen (2019年11月7日). 「Webにおけるスケーラブル・ベクター・グラフィックス（SVG）攻撃対象領域の分析」 . Fortinet Blog . 2023年2月21日時点のオリジナルよりアーカイブ。 2023年2月21日閲覧。
  79. ^ a b “SVG Security - W3C Wiki” . W3C . 2023年2月21日時点のオリジナルよりアーカイブ。2023年2月21日閲覧。
  80. ^ Concolato, Cyril (2005年7月). 「MPEG-4 LASeR ホワイトペーパー」 .国際標準化機構. 2011年7月25日時点のオリジナルよりアーカイブ。 2010年8月29日閲覧。
  81. ^ 「ISO/IEC 14496-20:2008 - 情報技術 - オーディオビジュアルオブジェクトの符号化 - パート20：軽量アプリケーションシーン表現（LASeR）およびシンプル集約フォーマット（SAF）」国際標準化機構。2011年5月14日時点のオリジナルよりアーカイブ。 2009年10月30日閲覧。
  82. ^ 「LASeR - リッチメディアサービスのためのMPEG標準」(PDF)。2011年2月21日時点のオリジナルよりアーカイブ(PDF) 。 2010年4月11日閲覧。
  83. ^ Chiariglione, Leonardo (2005年3月8日). 「Riding the media bits - Bits and bytes」 . 2010年9月25日時点のオリジナルよりアーカイブ。2009年10月30日閲覧。

「 https://en.wikipedia.org/w/index.php?title=SVG&oldid=1333804335」から取得