Wikipedia:SVGへの乗のり換かえ

SVG（Scalable Vector Graphics）とは、ベクトルからなる画像がぞう（ベクター画像がぞう）の一いち種しゅです。ウィキペディアを含ふくむウィキメディア・プロジェクトのウィキで使つかわれているMediaWikiというソフトウェアはSVG画像がぞうに対応たいおうしています。アップロードされたSVG画像がぞうは表示ひょうじする際さいに任意にんいの大おおきさのPNG画像がぞうに変換へんかんされます。これによって、SVGに対応たいおうしていないブラウザでもアップロードされたSVG画像がぞうを見みることができます。

SVGとは

SVGの利点りてん

ビットマップ画像がぞう（左ひだり）とSVG画像がぞう（右みぎ）をそれぞれ拡大かくだいすると、ビットマップ画像がぞうはぼやけるのに対たいし、SVG画像がぞうは画質がしつが良よいままである。

1. JPEG、GIFやPNGのようなピクセルからなる画像がぞう（ビットマップ画像がぞう）ファイル形式けいしきではないので、画質がしつの劣化れっかなしにどんなサイズにでも伸縮しんしゅく可能かのうです。
2. ウィキペディアを含ふくむウィキメディア・プロジェクトには「自由じゆうなコンテンツを提供ていきょうする」という目的もくてきがあります。編集へんしゅうしづらいビットマップ画像がぞうは「自由じゆう」ではありません。そのようなビットマップ画像がぞうと違ちがい、小ちいさな編集へんしゅう（一部分いちぶぶんの色いろだけ変更へんこうする、画像がぞう中ちゅうの文字もじ列れつを変更へんこうする、など）をかなり行おこないやすいので、SVGはウィキメディア・プロジェクトの目的もくてきにより適てきしています。

SVGの欠点けってん

1. 技術ぎじゅつ的てきな質しつが不十分ふじゅうぶんであるSVG画像がぞうによる問題もんだいは時々ときどきさらに深刻しんこくな問題もんだいをも引ひき起おこし、その害がいを抑おさえるためにSVGの描画びょうが時間じかんに制限せいげんが設もうけられてきました。
2. サーバーはSVGのすべての機能きのうを描画びょうがすることはできないため、生成せいせいされたPNGはときに作者さくしゃが意図いとしたものではなくなることがあります。

SVGには欠点けってんはありますが、劣化れっかしない画像がぞう形式けいしきの使用しようを推奨すいしょうするのはいいことで、SVGを用もちいた代替だいたい画像がぞうを提供ていきょうし、皆みなにこの形式けいしきを使つかうのを勧すすめるのには利点りてんがあります。ビットマップ画像がぞうをSVGに変更へんこうするのを依頼いらいするには、{{Convert to SVG}} テンプレートを画像がぞうの説明せつめいページに加くわえてください。ビットマップ画像がぞうのSVG版ばんがあることを、{{Vector version available}} テンプレートを画像がぞうページに貼はることによって知しらせることができます。

SVGを編集へんしゅうできるソフト

SVG は XML を用もちいているのでテキストエディタによるデータの作成さくせいも一応いちおう可能かのうですが、記述きじゅつは複雑ふくざつなため、編集へんしゅうソフトを使つかうほうが実用じつよう的てきです。高度こうどなグラフィクス作成さくせいに主眼しゅがんを置おいたグラフィックソフトから図ず、表ひょう、フローチャートなどの作成さくせいに主眼しゅがんを置おいたソフトまで幅はばがあります。

無償むしょうのもの

SVG の読よみ書かきが可能かのうなもの

• Inkscape - 標準ひょうじゅんのファイル保存ほぞん形式けいしきがSVGです。シンプルで使つかいやすいです。
• Dia

一部いちぶ制限せいげんがあるもの

• GIMP - 読よみ込こみに対応たいおう。書かき出だしはパスの書かき出だしのみ。

SVG の出力しゅつりょくが可能かのうなもの

• OpenOfficeDraw - 1.1までは日本語にほんご出力しゅつりょくが一部いちぶ乱みだれるなど難なんあり。2.0から書かき出だしをサポート。SVG Import Filterをインストールすれば読よみ込こみも可能かのう。
• R言語げんごはデータ解析かいせき結果けっかのグラフ出力しゅつりょく形式けいしきとしてSVGをサポートしています。
• Gnuplotはグラフ出力しゅつりょく形式けいしきとしてSVGをサポートしています。
• BKchemはSVG形式けいしきで化学かがく構造こうぞう式しきの出力しゅつりょくが可能かのうですが、下した付つき文字もじを用もちいる場合ばあいはテキストのパス変換へんかんが必要ひつようです。

無償むしょうでないもの（すでに持もっている方かた向むけ）

SVG の読よみ書かきが可能かのうなもの

• Adobe Illustrator Ver. ?以降いこう
• Microsoft Office Visio Ver. ?以降いこう
• Corel DRAW Ver. ?以降いこう
• Justsystems Xfy

SVG の出力しゅつりょくが可能かのうなもの

• 花子はなこ2006以降いこうは、SVG（Ver.1.0に準拠じゅんきょ）の書かき出だしをサポートしています。
• Omni GroupのOmniGraffle Professional 4は、SVG書かき出だしをサポートしています。
• ChemDraw/ChemBioDrawのVer.12以降いこうは、SVG書かき出だしをサポートしています。

このほかにも、CADきゃどソフトウエアには読よみ書かきともに対応たいおうしているものが多おおく存在そんざいします。

TIPS: Inkscapeは手持てもちの、またはアップロードされているビットマップ画像がぞうからSVGファイルを作成さくせいするのにとてもよいソフトです。SVGへの変換へんかんを行おこなうには、Inkscape上じょうでビットマップ画像がぞうを選択せんたくした状態じょうたいで「パス(P)」メニューを開ひらき、ビットマップをトレース(T)...をクリックするか、または「Shift + Alt + b」のキーボードショートカットを使つかってください。

どのような画像がぞうがSVGに適てきしているか

ピクトグラムや地図ちず記号きごうなどの図ず

• 
• 

地図ちず

• 
• 
• 

文字もじ

• 
• 
• 
  多た言語げんご対応たいおうファイル
  (lang=en指定してい時じ)
• 
  多た言語げんご対応たいおうファイル
  (lang=ja指定してい時じ)

グラフ

• 

フローチャートや説明せつめい図ず

• 

航空機こうくうきの三面さんめん図ず

• 

など、任意にんいの大おおきさで表示ひょうじされるような図ずです。地図ちずや説明せつめい図ずなどは、図ず中ちゅうにある文字もじ列れつに誤あやまりがあったときに修正しゅうせいがしやすくなります（文字もじ列れつをパスに変換へんかんしなかった場合ばあい）。

注意ちゅうい

文字もじ列れつのフォントはウィキメディアにインストールされているものにしてください。それ以外いがいのフォントを使つかおうとすると、文字もじの大おおきさが変かわったり、意図いとしない文字もじが表示ひょうじされたりする場合ばあいがあります。どうしてもそれ以外いがいのフォントを使つかう必要ひつようがある場合ばあいは、文字もじ列れつをパスに変換へんかんしてください。ウィキメディアにインストールされているフォントについては、https://noc.wikimedia.org/conf/fc-listで確認かくにんできます。日本語にほんごではIPAフォント・Noto・Takaoフォント・VLゴシックが利用りようできます。

PNG画像がぞうをより質しつの低ひくいSVG画像がぞう、もしくは実際じっさいには不正確ふせいかくなものと置おき換かえるのには不満ふまんの声こえがありました。特とくに後者こうしゃは百科ひゃっか事典じてんのプロジェクトでは許容きょようできないものです。置おき換かえられるものを不要ふようなものとする前まえに、置おき換かえるものの質しつは元々もともとのものと同おなじまたは優すぐれているということを完全かんぜんに確実かくじつにしてください。

PNG画像がぞうは代替だいたいとなるSVG画像がぞうが利用りようできるようになったとたんに一斉いっせいに削除さくじょされるべきではありません。画像がぞうの説明せつめいページに {{Vector version available}} テンプレートを付つけるだけで十分じゅうぶんな場合ばあいが多おおく、適切てきせつであれば作者さくしゃによってSVGバージョンに移行いこうされます。

制限せいげん

描画びょうがに関かんして、MediaWikiのSVGのサポートには重大じゅうだいな制限せいげんが設もうけられています。

1. markerタグ (<marker>) は正確せいかくにサポートされていません。
2. Text flow (<flow...>) はサポートされていません。代かわりに<text>を使つかってください。

SVG画像がぞうをアップロードするときはこれに加くわえてPNGバージョンもアップロードするほうが良よいかもしれません。

これらや他たのバグはlibrsvg (GNOME) bugzillaに報告ほうこくするべきで、画像がぞう例れいはコモンズにアップロードした場合ばあい、Category:Pictures showing a librsvg bugに入いれてください。

Bot

多おおくのページで使つかわれているビットマップ画像がぞうをSVGのものと置おき換かえるのに、Botを使つかうと便利べんりです。「Botの運用うんよう者しゃには手助てだすけしたいととても思おもっている人ひとが多おおく、彼かれらの怪物かいぶつ (Bot) を見みせびらかしています。」（コモンズの説明せつめい（原文げんぶんは英語えいご）より）

ウィキペディア日本語にほんご版ばん以外いがいで使つかわれている画像がぞうを置おき換かえる場合ばあいです。多おおくの、全すべてではないにしろ、Botの運用うんよう者しゃは習慣しゅうかん的てきにこのメーリングリストを読よんでいて、依頼いらいは特とくにここでするほうが良よいかもしれません。Botが全すべてのウィキペディアの画像がぞうを置おき換かえるのに、多おおくの要因よういんにもよりますが、数時間すうじかんからもしかしたら1日にちかかるかもしれません。

Botは運用うんようされている全すべてのプロジェクトで特別とくべつな許可きょかが必要ひつようで、その許可きょかはBotがするそれぞれ違ちがった作業さぎょうごとに与あたえられているということを覚おぼえておいてください。全すべてのプロジェクト、Botの全すべての使つかい方かたに対たいしての許可きょかはありません。全すべてのプロジェクトでBotを運用うんようするということは、方針ほうしんが決きめられているウィキの方針ほうしんに違反いはんした場合ばあい、BotやBotの運用うんよう者しゃが緊急きんきゅう措置そちとしてすべてのプロジェクトで投稿とうこうブロックを受うけるということになりやすいです！

よくある質問しつもん

SVG画像がぞうはどのくらいの大おおきさがいいですか？

画像がぞうページを見みたときにどのくらいの大おおきさで表示ひょうじされるかだけにしか影響えいきょうしないので、画像がぞうの絶対ぜったい的てきな大おおきさはそれほど問題もんだいではありません。ファイルサイズは画像がぞうの寸法すんぽうには関係かんけいしません！ この画像がぞうは、画質がしつやファイルサイズの変化へんかなしに、自由じゆうに拡大かくだいしたり縮小しゅくしょうしたりできます。推奨すいしょうされる画像がぞうの幅はばは600pxくらいだということを頭あたまに入いれておいてください。画像がぞうを等とう倍ばいで見みたとき、600-800pxの幅はばだとちょうどよい大おおきさで見みえ、拡大かくだいや縮小しゅくしょうすることなしに画面がめんの大おおきさと画像がぞうの全体ぜんたいの大おおきさを合あわせられます。

Inkscapeではどのように画像がぞうの大おおきさを変更へんこうするのですか？

そのままでは画像がぞうの大おおきさはA4になっています。これを大おおきくしたり小ちいさくしたりするには、画像がぞうの大おおきさにしたい寸法すんぽうで長方形ちょうほうけいを作つくり、それを選択せんたくします。そして「ファイル(F)」→「ドキュメントのプロパティ(D)」をクリックし、「カスタムサイズ」の中なかの「ページサイズを描画びょうが全体ぜんたいまたは選択せんたくオブジェクトに合あわせる(R)」をクリックし、OKをクリックします。このあと「サイズを決きめるための」長方形ちょうほうけいは削除さくじょしてもかまいません。他たの形状けいじょうは用紙ようしに収おさまるように移動いどうしたり大おおきさを変かえたりしてください。

文字もじが四角よつかどになったり、ウィキペディアにアップロードにしたらまったく見みえなくなります！

いくつかのInkscapeのテキストの機能きのうはウィキペディアではサポートされていません。テキストのオブジェクトを選択せんたくし、「パス(P)」→「オブジェクトをパスへ(O)」をクリックします。テキストがパスに変換へんかんされます。プレーンSVGで保存ほぞんし、ファイルをアップロードしなおしてください。

矢印やじるし・ダッシュが四角よつかどになったり、ウィキペディアにアップロードにしたらまったく見みえなくなります！

いくつかのInkscapeのストロークの機能きのうはウィキペディアではサポートされていません。そのようなオブジェクトを選択せんたくし、「パス(P)」→「ストロークをパスに変換へんかん(S)」をクリックします。ストロークがパスに変換へんかんされます。プレーンSVGで保存ほぞんし、ファイルをアップロードしなおしてください。

どのようにして透過とうかの背景はいけいを取とり除のぞくのですか？

そうする必要ひつようが本当ほんとうにあるのでしょうか？ 大抵たいていは無ないです！ ウィキペディアのレンダラはSVGファイルを、表示ひょうじ用ようの白しろい背景はいけいを付つけPNGに変換へんかんします。ネイティブにSVGの透過とうかをサポートするブラウザは画像がぞうを通とおして背景はいけい色しょくを表示ひょうじしますが、その色いろは白しろです！ 画像がぞうの背景はいけいを透過とうかにしておくことは、背景はいけいに大おおきな白しろい四角よつかどが出でず他ほかの色いろの背景はいけい色しょくが表示ひょうじされ、後あとでその画像がぞうを編集へんしゅうする人ひとにとっては良よいことです。しかし、本当ほんとうにその画像がぞうに特とくに背景はいけい色しょくを必要ひつようとするならば、画像がぞうの大おおきさと同おなじ大おおきさの長方形ちょうほうけいを作つくり、好すきな背景はいけい色しょくをつけ、そして、「オブジェクト(O)」→「Lower to Bottom」をクリックしてください。画像がぞうを保存ほぞんして、solidな背景はいけい色しょくにしてください！

フォントによっては正まさしく描画びょうがされません。このサイトではどのフォントがサポートされていますか？

SVG fontsにリストがあるのでご覧らんください。

アップロード前まえの描画びょうが確認かくにん

ここまで説明せつめいしたように、アップロードしてもSVG画像がぞうが正ただしく描画びょうがされない場合ばあいもあります。英語えいご版ばん利用りよう者しゃJarry1250が作成さくせいしたJarry1250's Wikimedia Laboratory - SVG Checkを使つかえば、アップロード前まえにウィキメディアのサーバで問題もんだいなく描画びょうがされるかどうか確認かくにんできます。

関連かんれん項目こうもく

• Scalable Vector Graphics - ウィキペディア日本語にほんご版ばんにおけるSVGの記事きじ
• meta:SVG image support - メタウィキによるSVG画像がぞうサポートに関かんする情報じょうほう
• commons:Help:SVG - ウィキメディア・コモンズ上じょうのSVGに関かんするヘルプページ