ビットマップ画像とベクター画像について
コンピューターグラフィックスにおいて使用される2つの主要な画像形式です。下記のような特徴があるので、一般的に、写真やリアルな画像の場合はビットマップ画像、図形やイラストレーションの場合はベクター画像を選択されます。
ビットマップ画像：
ビットマップ画像はラスター画像とも呼ばれ、色情報を含んだ四角い小さなピクセルの集まりとして表現しています。そのためビットマップ画像は解像度（１インチ四方に何ピクセルあるか）に依存していて解像度を変更すると画質が劣化する傾向があります。
ビットマップ画像形式＝JPEG、PNG、GIFなど
ベクター画像：
ベクター画像は、図形や曲線を数学的な式や座標で表現しています。これにより、画像を拡大・縮小しても画質が劣化しません。
ベクター画像は解像度に依存せず、再利用や変更が容易なので、図形や文字のような幾何学的な要素が多い場合に適しています。
ベクター画像形式＝SVG（Scalable Vector Graphics）など
ビットマップ画像のメタモルフォーゼ
ビットマップ画像を変形させる場合、変形前と変形後で対応するポイントを指定し、その中間画像をコンピュータが計算して作り出します。複雑な画像の場合は細かく指定する必要があります。
下記の例は、以前、科学番組のために筆者（西本）が作成したものです。
・「アシカ・アザラシ」
カワウソのような動物から変化してアシカのような動物になります。
・「チューリップの球根」
チューリップの花を摘みとった後で球根が増える様子です。
・「胎児の成長」
子宮の中で胎児が成長する様子です。
※ 下のサムネールをクリックしてご覧ください。
ベクター画像のメタモルフォーゼ
ベクター画像をコンピュータで中割りをさせた例を紹介します。
画像全体を一気に変形させても思い通りの変形にはならないので、変形前と変形後の画像を単純なパーツに分けて、それぞれが対応するよう指定して変形させます。
下記の例は、以前、授業での説明のために筆者（西本）が作成したものです。
ビットマップとベクターの比較
ビットマップ画像とベクター画像を拡大して見た時の比較をしています。
ビットマップ画像はピクセルで出来ているので、拡大するとピクセルで出来ていることがわかります。ベクター画像は数式で作られているので拡大してもピクセルは現れず形も崩れません。
ベクター画像は、コンピュータが計算して図形を作るので、複雑な模様やテクスチャーのある画像では表示に時間がかかります。
したがって素早く表示する必要のある動画では、シンプルな形態の表示に向いています。
※ 下のボタンをクリックすると拡大・縮小します。
ベクター画像の作画例
ベジェ曲線のアンカーポイントと、そこから伸びるハンドルを移動させて、ごく簡単なリンゴの絵を作成しています。
文字のメタモルフォーゼ
下の文字の、上段と下段の文字をクリックすると、英語の文字が、日本語の漢字とカタカナに変化します。
このアニメーションでは、文字をベクター画像に変換して細かく分解し、英語の文字の各パートが日本語の文字のパートに置き換わるようにしています。
※ 下の「INFORMATION」 「DESIGN」の文字部分をそれぞれクリックすると変化します。