コンテンツにスキップ

ベクター画像

出典: フリー百科事典『ウィキペディア(Wikipedia)』
ベクター形式から転送)

ベクター画像(ベクターがぞう、: vector graphics)は、コンピュータグラフィックスなどにおいて、画像を円や直線などのような解析幾何学的な「図形」の集まりとして表現する表現形式である。平面をスキャンし、その各点の濃淡の集まりによって画像を表現する「ビットマップ画像」(ラスター形式)と対置される。それを描画する操作として(仮想の)絵筆を動かすようなスタイルになることから、ドロー形式、ドローグラフィックなどとも呼ばれる。

座標

[編集]

ビットマップ画像が通常[注 1]、データの順序によって座標を間接的に示すのと異なり、ベクター画像はオブジェクトごとに座標を明示的に指定するものが多い。

直交座標と極座標

[編集]

縦横の位置で表す「直交座標」と、方向と距離で表す「極座標」がある。極座標のほうが便利な場合もあり、たとえば一般の回転角についてなど、厳密な結果を保存するために極座標が必要なこともあるが、通常は直交座標のほうが扱いやすい。また円弧の指定などでも併用される。

絶対座標と相対座標

[編集]

常にグローバルな原点をベースとする「絶対座標」と、他オブジェクトからの位置関係や、最終参照位置との相対で表す「相対座標」がある。

たとえば、LOGOなどの「タートルグラフィックス」では、もともと、コンピュータから制御される、実体を持ったロボット(右の写真を参照)を制御するというモデルをベースとしていたこともあり、相対座標が基本である。

この2種類もやはり併用されることも多い。全体に対する(グローバルな)絶対座標によりあるオブジェクト(図形のグループ)の原点(座標系)を指定し、そのグループ内の図形はその(ローカルな)座標系を使って定義する、といった感じである。そのようにすると、たとえば、ローカルな座標系に対し移動や変換を掛けるだけで、そのグループ自体には干渉することなくその全体を移動や変形させることができる。

オブジェクト

[編集]

プリミティブと複合

[編集]

複数の図形のグループ化や、ステンシルとしての使用など複数の図形を組み合わせる方法と、それらの基になるプリミティブが用意されていることが多い。

プリミティブ

[編集]

プリミティブ: primitive)は形状が仕様で規定された図形である。基本図形きほんずけい: basic shapeとも[1]。プリミティブに含まれる図形は仕様ごとに異なるが、典型的なものとして以下が挙げられる:

パス

[編集]

点で結ばれた線で図形を表す。結ばれた線の終点が始点と重なった、四角や円、多角形などの閉じた図形の内部の領域を「面」と呼ぶ。点の座標と、線の属性(線の太さ、色、破線、実線など)、線で囲まれた面の属性(色や、パターンなど)、で表現される。点、線、面のそれぞれのさまざまな性質、たとえば、線の起終点の位置、曲線であればその曲がり方、太さ、色、それら線に囲まれた面の色、などの変化のしかたなどを数値で表す。SVGでは、任意のアウトラインを表現するために、このプリミティブを大量のデータをともなって多用することを考慮したデータ形式(path要素のd属性の値)となっている。

文字

[編集]

文字(ないし文字列)もオブジェクトとして扱えることが多い。文字自身の文字コードと座標の他、フォント名、サイズ、色、変形方法などが指定できることが多い。サイズには他のオブジェクト同様の、座標値やミリ単位の他に、ポイントなど文字として扱いやすい単位も使えることが多い。

ストローク

[編集]
ストロークと等価なアウトライン

ストローク: stroke)は始点と終点を持つ線である[2]筆画とも。

ストロークは鉛筆や筆で書かれた「ひと画」に相当する線である。ストロークは始点と終点を持つため、各点が方向を持つ。これはアウトラインと対照的である(参考: ストロークフォントアウトラインフォント)。ストロークはしばしば可変幅である。つまり始点はドンと太く置き、終点はスッと細く払うといった表現が可能になる。これは可変幅パスと同義である。

ストロークの実装では対象を中心線と各位置での幅として捉えたうえで、中心線を点列で近似し各点に太さを持たせる形がしばしば取られる[2]。レンダリング時には滑らかに補間するか、点列を密にしたうえで単に直線で結ぶ(=可変幅ポリライン)。

ビットマップ

[編集]

ビットマップ画像もひとつのオブジェクトとして扱うことができるものも多い。描かれる座標と縦横の表示上のサイズ(または縦横の解像度や拡大率)を持つ。場合によっては、描画方向(回転角度や反転軸)、アフィン変換などの変形の情報を持つこともある。ビットマップデータは、埋込み方式のものもあれば、外部のファイルなどを参照する方式もある。大きな画像データなどでは後者の方法が扱えたほうが取り回しが良いが、ファイル1個に必要な全てのデータが入っていない不便もある。

変換

[編集]

多くのドローソフトあるいはデータ形式では、これらのオブジェクトに対し、拡大縮小・回転などを掛けることができる。一般化してアフィン変換としているものが多い。共通部分や差分を取り出す、いわゆるブーリアン演算も付いているものが多い。グラデーションや透明度(アルファ、あるいは不透明度opacity)などを扱えるドローソフトやグラフィックフォーマットもある。透明度を含んだ合成に関する詳細はアルファチャンネルの記事を参照。

ベクタイメージは、デバイス非依存の図形・画像を記述するのに優れている。ラスタライズや印刷の処理プログラム等を各デバイス向けに作ることができ、それぞれの描画指示のもととなる図形情報だけをデータとして扱うことができるからである。このような考え方からPostScriptPDFといったページ記述言語の描画モデルはベクタベースである。

3次元コンピュータグラフィックスでは3次元空間上の多角形(ポリゴン)や曲面等として形状を作成する。これは2次元図形であるベクタイメージを作成するとき、基本図形を組み合わせて複雑な図形イメージを作ることと非常に似ている。この3次元の図形イメージを透視図法などで2次元のビットマップに変換する作業をレンダリングと呼ぶが、これは、形状や位置のほかに、光のあたり具合なども計算しなければならないので、2次元のラスタライズの処理に比べはるかに複雑である。そのためゲームなどの速度を要するレンダリングでは、曲面を用いずに平面であるポリゴンの集まりで物体を表現するのが普通である。

フォーマット

[編集]

macOSで使われるQuickDrawDTPで使われるPostScriptCADで使われるHP-GLなどがある。PostScriptやHP-GLなど「図形処理言語」と呼ばれるものは、形状表現だけではなくプログラミング言語的な機能も持つものがある(特に、PostScriptはほとんど汎用言語並みの能力がある)。アプリケーションだけでなく、プリンタ内部にもそれらの言語処理系が用意され、スピーディにラスタライズできる機種がある。

以下はベクター画像フォーマットの一例である:

ビットマップ画像との変換

[編集]

ベクター画像のラスター化

[編集]

ベクター画像のイメージデータはビットマップ画像に変換できる。多くの場合、OSにその機能のAPIがあるので、アプリケーションはその機能を呼び出すだけでよい。ディスプレイの何倍もの画素数であっても、内部に仮想フレームバッファを設定すれば可能となるが、そのためには大きなメモリが必要である。

ビットマップ画像のベクター化

[編集]

逆は一般に難しい。なぜなら、逆問題だからである。一部の高度なソフトにはベクター化の機能を持つものもあるが、必ずしも万能ではない。2016年現在でも、新しい手法の提案などが学会等での研究発表で見られる分野である。

パフォーマンス

[編集]
ベクタイメージビットマップ
ベクタイメージビットマップ
ベクタイメージビットマップ
ベクタイメージビットマップ
ベクタイメージは品質の劣化なくサイズを変更可能

画像をピクセルの集合で表現しようとするビットマップと比べ、拡大、縮小、その他の変形を施しても図形イメージが基本的に劣化しないという特性を持つ。単純な図形で構成されている場合、ビットマップ画像よりもデータサイズは小さい。

しかしながら、写真のような画像から線や面を抽出して数値化することは現在の技術では困難であり、実際には、はじめからグラフィックソフトウェアを使用してベクタイメージを作成する場合を除いては、画像アプリケーションには使われない。すなわち、ロゴや非リアリスティックなイラストには向くが、そのほかの一般画像には不向きである。逆に文字のフォントデザインにおいては、拡大や縮小その他の変形が容易なことから、多用される。このようなベクタイメージの手法を用いた文字フォントを「アウトラインフォント」と呼ぶ。

出力

[編集]

ディスプレイ

[編集]

ラスタースキャンディスプレイにはラスタライズして表示される。

1950〜1980年代のコンピュータでは、ラスタースキャンでの高精細な表示は高価につき(ラスタースキャンに必要なフレームバッファを構成できる性能と容量のメモリなどのため)難しいことから、図形の表示目的に、ベクタースキャンディスプレイが用いられていた(また当時はプロッターも活用された)。CADなどで使われた。ベクタースキャンでは、スキャンの速さを変えることでも輝度を変えることができる。これに対しラスタースキャンでは、ブラウン管電子銃は表示面を均等に走査するのであって、輝度は電子銃からの電子線の強さを変調することで表現している。

紙への出力

[編集]

プリンターの多くもディスプレイ同様、ラスタスキャンを行っている。それゆえアウトラインフォントのテキストやベクタイメージを印刷するときは、OS上もしくはプリンターの内部で、高解像度にラスタライズされてから印刷している。

プロッターは、ベクター画像のデータを直接印刷する。これはペンなどを移動させて作図しており、図形処理言語が座標を指定して作図することからX-Yプロッタとも呼ばれる。プロッターは設計図面の印刷などに用いられる。

編集用ソフトウェア

[編集]

ベクター画像を製作編集するためのソフトウェアはドローソフトと呼ばれる[3]Adobe Illustratorをはじめとして様々な専用ソフトウェアが存在する。また様々な汎用グラフィックソフトウェアにベクター系ツールとして編集機能が内蔵されている(例: Microsoft PowerPointの図形機能)。

ストローク機能の実装としては Adobe AnimateBlender GreasePencil が知られる。ストローク機能を持たないソフトウェアでストロークを扱いたい場合、アウトラインパスとフィルの組み合わせでしばしば表現される。これはカリグラフィーツール: calligraphy Tool)とも呼ばれ[4][5]、筆圧機能をベクターに変換する役割を果たす。

脚注

[編集]

注釈

[編集]
  1. ビットマップ画像でも、部分的な差分などのために座標が付いているデータも少なくない。

出典

[編集]
  1. 1 2 3 4 5 6 7 8 basic shape ... A graphics element that is defined by some combination of straight lines and curves. Specifically: ‘circle’, ‘ellipse’, ‘line’, ‘path’, ‘polygon’, ‘polyline’ and ‘rect’.W3C (2018年10月). Scalable Vector Graphics (SVG) 2”. World Wide Web Consortium. 2024年9月9日閲覧。
  2. 1 2 ストローク‐フォント(stroke font) コンピューターで用いるフォントのうち、文字の形を中心線の座標データとして保持するもの。(kotobank-ストロークフォント)
  3. ベクター形式の画像を製作するソフトウェアのことをドローソフトとも呼ぶ .p.23 より引用。蛭田, 眞平; 角井, 敬知 (2010). “グラフィックソフトを用いたデジタル記載図の作成技法”. タクサ:日本動物分類学会誌. 29: 19–30.
  4. カリグラフィーツール カリグラフィーツールではタブレット入力による可変幅の線を描くことができます。カリグラフィーツール”. KRITA リファレンスマニュアル Revision de7020f. 2024年10月19日閲覧。
  5. The Calligraphy Tool What a goose quill was in antiquity, is Inkscape’s calligraphy tool in the digital world.The Calligraphy Tool”. Inkscape Beginners' Guide, Revision 9a98ab02. 2024年10月19日閲覧。

参考文献

[編集]

関連項目

[編集]