JP4066585B2

JP4066585B2 - 図形作成方法

Info

Publication number: JP4066585B2
Application number: JP2000017876A
Authority: JP
Inventors: 洋一堀井; 洋之野村
Original assignee: Hitachi Ltd
Current assignee: Hitachi Ltd
Priority date: 2000-01-24
Filing date: 2000-01-24
Publication date: 2008-03-26
Anticipated expiration: 2020-01-24
Also published as: JP2001209816A; US6549205B1

Description

【０００１】
【発明の属する技術分野】
本発明は図形作成方法に関し、特に電子計算機を用いた２次元形状を扱う図形処理ソフトウェアによる画像作成を支援する方法、２次元アニメーションに好適な図形作成方法に関する。
【０００２】
【従来の技術】
伝統的手法なセルアニメーションは、背景など動かない部分を紙に描き、キャラクターなど動く部分をセルロイドに描き、これらを重ね合せたものをカメラで撮影して制作されていた。セルロイドに描く部分は、以下の原画工程、動画工程、仕上げ工程に大きく分けられる。原画工程では、原画と呼ばれるキーとなるフレームを紙にラフな線画で描く。次に動画工程では、原画と原画の間をクリーンアップされた丁寧な線を用いて中割りされた線画を紙に描く。さらに仕上げ工程では、動画をセルロイドに転写し、裏から絵の具で色を塗る。これに対し、近年進んでいるデジタル化されたアニメーション制作の手法は、仕上げ工程以降を計算機上で行うといった方法である。すなわち、手作業で紙に描かれたすべての動画をスキャナーなどで計算機に取り込み、ペイントソフト等で彩色し、背景画とデジタル合成していた。
【０００３】
つまり、デジタル化されたアニメーション制作でも、動画は手作業で紙に描かれているのが現状であり、この工数は膨大である。一方、本願出願人がすでに特許出願した特願平10-352258号明細書、図面に記載したように、原画をスキャナーなどで計算機に取り込み、これを参照しながら図形を作成して原画と原画の間の形状を計算機により自動補間することによりアニメーションを制作する手法が提案されている。
【０００４】
図形の作成は、ベジェ曲線を用いる手法が一般的であり、広く図形作成ソフトウェアに取り入れられている。例えば、アドビ社イラストレータ8.0日本語版マニュアル第六十五頁に記載されている。ベジェ曲線の作成は、図９に示すように、マウスなどのポインティングデバイスのボタンを押した時のカーソルの位置を頂点の位置とし、離された時のカーソルの位置をベジェ曲線の一方のコントロールポイントとする方法が一般的である。この際、他方のコントロールポイントは頂点と対称の位置に設定される。ベジェ曲線が作成された後、必要に応じて、頂点やベジェコントロールポイントを直接操作することにより、所望の形状を得る。
【０００５】
また、取り込んだ画像を元に、自動的にベジェ曲線を作成するオートトレース機能も知られている。これは、画像の一点をポインティングデバイスにより指定することにより、指定された画像の色域情報からベジェ曲線を作成する機能である（例えば、アドビ（Adobe）社が販売しているソフトウエア名称である「イラストレータ8.0日本語版」に添付のマニュアル第100頁から第101頁に記載されている。）。
【０００６】
【発明が解決しようとする課題】
上記の一般的なベジェ曲線の作成および修正には、ベジェコントロールポイントを直接操作する必要がある。ベジェコントロールポイントは、１つの頂点に２つあるため、その作業は膨大なものとなるといった問題があった。
【０００７】
また、オートトレース機能は、色域にギャップがある場合、すなわち、手描きの線が途中で途切れている場合には正しくベジェ曲線を作成できないといった問題があった。さらに、オートトレース機能では、頂点の位置も計算機により自動的に生成されてしまうため、計算機により自動補間する際、自然な補間結果が得られにくいといった問題があった。
【０００８】
本発明の目的は、原画を計算機に取り込み、原画をなぞりながら図形を作成するソフトウェアにおいて、原画の線が途中で途切れていても問題が少なく、頂点位置は操作者が指定し、ベジェ曲線のコントロールポイントは直接操作する必要がない、図形作成方法を提供することである。
【０００９】
【課題を解決するための手段】
上記の目的を達成するために、まず、紙に描かれた複数の原画を計算機に取り込む。次に最初の原画の輪郭線上をベジェ曲線でユーザーがトレースする。このとき、ユーザーはベジェ曲線の頂点となる点を順次指定するだけで、計算機は頂点の位置情報と計算機に取り込まれた原画の情報から、順次ベジェ曲線を自動的に生成する。自動計算のために、最後に指定した頂点と現在のカーソル位置の区間を結ぶ最適な経路を求め、該経路を３次元方程式で近似し、該方程式の各項の係数をベジェ曲線の係数と比較し、ベジェ曲線を生成する。
【００１０】
２番目以降の原画については、先に作成されたベジェ曲線の頂点を、輪郭線上に乗るように手動で移動する。さらに輪郭線の付近をマウスによりドラッグすることにより、ドラッグした軌跡にフィットするようにベジェ曲線が自動的に再計算される。
【００１１】
【発明の実施の形態】
（実施例１）
以下、図面を用いて本発明の一実施例を説明する。
【００１２】
(1)システム構成
図１に本発明の一実施例に係る図形作成システムを示す。
【００１３】
画面131-1から131-8は、本システムのディスプレイ131に表示される画面表示例である。
【００１４】
中央処理装置152に接続された記憶装置151の中に、本発明の図形作成方法を適用した図形作成ソフトウェア200を置く。
【００１５】
図形作成ソフトウェア200は、180, 300, 600, 181, 400の各ルーチンを起動して処理を行う。
【００１６】
画像読み込みルーチン180を起動して、手描きされた１枚目の画像を読み込み、必要に応じてディスプレイ131に表示する(131-1)。
【００１７】
画像トレースルーチン300を起動して、該画像をベジェ曲線からなる閉曲線によりトレースし、必要に応じてディスプレイ131に表示する。131-2は２番目の頂点を指定しようとしている途中を示す。１番目の頂点とポインティングデバイス(153)が差し示すカーソルの現在の位置を結ぶ、なるべく画像の線に沿うようなベジェ曲線が表示される（図中の点線で当該ベジェ曲線を示す）。131-3は１番目と２番目の頂点の区間のベジェ曲線が計算された後、３番目の頂点を指定しようとしている途中を示す。131-4はすべての頂点が指定され、すべての区間のベジェ曲線が計算された結果を示す。頂点から伸びる２本の線分の端点はベジェ曲線のコントロールポイントを示す。
【００１８】
次に、画像読み込みルーチン180を再度起動して、手描きされた別の画像を読み込み、必要に応じてディスプレイ131に表示する(131-5)。
【００１９】
図形修正ルーチン600を起動して、読み込まれている別の画像に対応する図形の修正を行う。ポインティングデバイス(153)のボタンが押された時、カーソルが図形の頂点の上にあった場合、図形の頂点をユーザーが頂点を対応する画像の輪郭線上に移動する(131-6)。このとき、図形の丸みを維持するため、手動で移動した頂点の移動量と同じだけコントロールポイントを平行移動する。
【００２０】
頂点以外の場所でボタンが押された場合、ボタンが離されるまでのカーソルの軌跡の各点について、しきい値（このしきい値はユーザが任意に定めることが可能である。）より暗い画像の点のうち、それぞれから最も近い暗い点（明度が最低の点）を求め、これらの点列からベジェ曲線を計算する(131-7)。131-8はすべての区間で修正が施された結果を示す。
【００２１】
最後に、図形出力ルーチン181を起動して、読み込まれた画像に対応する図形データを記憶装置に出力する。
【００２２】
作成された図形データは、必要に応じて他の画像編集システム154に送った後、プリンタ156に入力されて紙に印刷されるか、またはVTR装置157に入力されて映像ソフトとなる。他の画像編集とは、具体的にはコンピュータグラフィクスソフトウェア、２次元図形編集ソフトウェア、文章編集ソフトウェア等を用いたシステムのことである。画像トレースルーチン300、図形修正ルーチン600およびこれらのルーチンから用いられるベジェ曲線計算ルーチン(400)については後で詳しく述べる。
【００２３】
(2)処理の流れ
図２を参照して、本実施例の処理の流れ201について説明する。まず、記憶装置151内の図形作成ソフトウェア200を起動する。
【００２４】
210において、画像読み込みルーチン180を起動して、一枚目の画像を読み込む。
【００２５】
211において、画像に含まれる部分の図形の数だけ、212, 213 の処理を繰り返す。
【００２６】
212において、画像トレースルーチン300を起動して、画像の部分に対応するベジェ曲線から構成される図形を作成する。
【００２７】
213において、必要に応じて、図形修正ルーチン600を起動して、該図形を修正する。
【００２８】
214において、アニメーションなどの目的で、関連する２枚以上の画像がある場合には、215以降の処理を画像の枚数だけ繰り返す。
【００２９】
215において、画像読み込みルーチン180を再起動して、別の画像を読み込む。
【００３０】
216において、217の処理を211で作成された図形の数だけ繰り返す。
【００３１】
217において、必要に応じて、図形修正ルーチン600を起動して、該図形を修正する。
【００３２】
218において、図形出力ルーチン181を起動して、読み込まれた画像に対応する図形データを記憶装置に出力する。
【００３３】
(3)画像トレースルーチン
図３および図５を用いて、画像トレースルーチン300について説明する。
【００３４】
画像トレースルーチン300では、読み込まれた画像に対応した図形を作成する。
【００３５】
以下に、画像の部分に対応した１つの図形を作成するための流れについて説明する。
【００３６】
310において、ポインティングデバイス153のボタンが押されるまで待機する。
【００３７】
311において、カーソル位置を検出し、１番目の頂点を指定する。
【００３８】
312において、カウンターNに２を代入する。ここで、Nは頂点の数を表すカウンタ−変数である。
【００３９】
313において、ポインティングデバイス153のボタンが離されるまで待機する。
【００４０】
314において、以下の処理を繰り返す。ただし、321または322の条件により、ループを抜ける。
【００４１】
315において、316から320の処理を繰り返す。
【００４２】
316において、N-1番目の頂点の座標をC0に代入する。
【００４３】
317において、現在のポインティングデバイスの示すカーソル位置をC1に代入する。
【００４４】
318において、画像からC0-C1区間の経路を検出し、(Xi, Yi)に格納する。(Xi, Yi)はC0を始点、C1を終点とする点列で、画像に描かれている線に沿うような経路とする。このような経路検出は、画像認識の分野で知られている手法である。図５(a)に検出された経路の一例を示す。
【００４５】
319において、ベジェ曲線計算ルーチン400を起動して、C0, C1, および経路(Xi,
Yi)から、C0-C1区間のベジェ曲線を計算する。
【００４６】
320において、ディスプレイ131にC0-C1区間のベジェ曲線を表示する。
【００４７】
321において、ポインティングデバイスのボタンが離された後、カーソルの位置がN-1番目の頂点と十分近くであれば、処理を終える。この場合、図形は閉じた曲線ではなく、始点と終点が異なる開いた曲線として作成される。
【００４８】
322において、カーソルの位置が１番目の頂点と十分近くであれば、323の処理を経て、処理を終える。
【００４９】
323において、N-1番目と１番目の頂点の区間のベジェ曲線を計算する。この場合、図形は始点と終点が一致する閉じた曲線として作成される。
【００５０】
324において、カーソル位置を検出し、N番目の新たな頂点を指定する。
【００５１】
325において、N-1番目とN番目の区間のベジェ曲線を計算する。
【００５２】
326において、Nをカウントアップする。
【００５３】
327において、ボタンが離されるまで待機し、315の処理へ戻る。
【００５４】
(4)ベジェ曲線計算ルーチン
図４および図５を用いて、ベジェ曲線計算ルーチン400について説明する。
【００５５】
ベジェ曲線計算ルーチンでは、端点（C0およびC1）とサンプリングポイント（すなわち検出された経路(Xi, Yi)）を入力とし、ベジェ曲線のコントロールポイント(b0およびb1)を出力する。
【００５６】
411において、経路の総延長距離を求め、Lに代入する。すなわち、図５(b)に示すように、経路の各点列の区間の距離λiを積算する。
【００５７】
412において、siに経路の点列のC0からの距離を格納する。
【００５８】
413において、siの各成分をLで割って、0から1に規格化する。
【００５９】
414において、以下の415から418の処理を行い、ベジェコントロールポイント(b0, b1)の水平および垂直座標それぞれについて個別に求める。
【００６０】
415において、水平座標を求める場合はriにXiを、垂直座標を求める場合はriにYiを代入する。図５(c)は水平座標の場合の(si, ri)、図５(d)は垂直座標の場合の(si, ri)を示す。
【００６１】
416において、(si, ri)から最小自乗法により、３次元方程式f(s)を求める。すなわち、３次元方程式の定数項、sの係数、sの２乗の係数、sの３乗の係数をそれぞれθ0、θ1、θ2、θ3としたとき、次式のεが最小となる係数を求めればよい。
【００６２】
【数１】

【００６３】
この係数を求めるために、行列Θ、Ｓ、Ｒをそれぞれ以下のように定義する。
【００６４】
【数２】

【００６５】
【数３】

【００６６】
【数４】

【００６７】
εが最小となる係数の行列Θは次式より得られる。
【００６８】
【数５】

【００６９】
ここで-1は逆行列を、tは転置行列を示す。以上によりサンプリングポイントにフィットした３次元方程式f(s)
【００７０】
【数６】

【００７１】
の各係数θ0、θ1、θ2、θ3が得られる。しかしながら、この方程式は端点(C0およびC1)を通る保証はない。そのため、417において該３次元方程式を修正する。
【００７２】
417において、f(s)を用いて、端点(C0およびC1)を通る方程式g(s)を求める。まず、g(s)を次式のように定義する。つまり、定数項、sの係数、sの２乗の係数、sの３乗の係数をそれぞれθ'0、θ'1、θ'2、θ'3とする。
【００７３】
【数７】

【００７４】
s=0においてg(s)はC0の水平（または垂直）成分と一致するため、次式が成り立つ。
【００７５】
【数８】

【００７６】
また、s=1において、g(s)はC1の水平（または垂直）成分と一致するため、次式が成り立つ。
【００７７】
【数９】

【００７８】
さらに、s=0におけるf(s)とg(s)の接線方向が一致するとすれば、次式が成り立つ。
【００７９】
【数１０】

【００８０】
また、s=1におけるf(s)とg(s)の接線方向が一致するとすれば、次式が成り立つ。
【００８１】
【数１１】

【００８２】
数８から数１１により、g(s)の各係数θ'0、θ'1、θ'2、θ'3が得られる。
【００８３】
418において、g(s)からベジェコントロールポイント(b0, b1)を求める。ベジェ曲線は次式により定義される。
【００８４】
【数１２】

【００８５】
ベジェ曲線の方程式の定数項、sの係数、sの２乗の係数、sの３乗の係数をg(s)の係数と比較することにより、b0およびb1の各成分が得られる。具体的には以下の２式からb0, b1を求めることができる。
【００８６】
【数１３】

【００８７】
【数１４】

【００８８】
以上の処理により、端点およびサンプリングポイントからベジェ曲線を定義することができる。
【００８９】
(5)図形修正ルーチン
図形修正ルーチン600では、すでに設定された図形の形状を変型する。
【００９０】
ポインティングデバイス(153)のボタンが押された時、カーソルが図形の頂点の上にあった場合、図形の頂点を移動する。このとき、ベジェコントロールポイントも頂点の移動量と同じだけ移動する。頂点以外の場所でボタンが押された場合、ボタンが離されるまでのカーソルの軌跡の各点について、しきい値より暗い画像の点のうち、それぞれから最も近い暗い点を求め、これらの点列からベジェ曲線を計算する。以下、このベジェ曲線の再計算について、図６を用いて説明する。
【００９１】
610において、カウンターiに０を代入する。
【００９２】
611において、ポインティングデバイスのボタンが押されている間、612から614の処理を繰り返す。
【００９３】
612において、uおよびvにカーソル位置の水平および垂直座標を代入する。
【００９４】
613において、しきい値より暗い画像の点のうち、(u, v)から最も近い暗い点を(Ui, Vi)に代入する。
【００９５】
614において、iをカウントアップする。
【００９６】
615において、サンプリングポイント(Ui, Vi)をセグメント毎に分割する。すなわち、図形の各頂点から最も近いサンプリングポイントを求め、図形の隣り合う頂点に対応するサンプリングポイントを両端とする点列群に分割する。
【００９７】
616において、分割されたセグメントの数だけ、617から619の処理を繰り返す。
【００９８】
617において、(Xi, Yi)に分割されたセグメントのサンプリングポイントを代入する。
【００９９】
618において、C0およびC1に、セグメントの両端に対応する図形の頂点座標を代入する。
【０１００】
619において、C0, C1, (Xi, Yi)を用いて、ベジェ曲線計算ルーチン400により、頂点間のベジェ曲線を計算する。
【０１０１】
（実施例２）
図７を用いて、別の実施例を説明する。
【０１０２】
多角形を作成した後、読み込まれた画像にフィットするようなベジェ曲線に、該多角形を自動的に変型させる。
【０１０３】
まず、701に示すように、画像読み込みルーチンを起動して、画像を読み込む。読み込まれた画像の上に、多角形を作成する。
【０１０４】
次に、多角形の頂点間のすべての区間について、図３の318と同様の手法で、頂点と頂点を結ぶ最適な経路(Xi, Yi)を検出する。また、C0およびC1に両端の頂点を代入する。ベジェ曲線計算ルーチンを起動して、C0, C1, (Xi, Yi)よりベジェ曲線のコントロールポイントを計算する。702は自動計算された結果を示す。
【０１０５】
（実施例３）
図８を用いて、別の実施例を説明する。
【０１０６】
多角形を作成した後、読み込まれた画像にフィットするようなベジェ曲線に、経路を指定することにより変型させる。
【０１０７】
まず、801に示すように、画像読み込みルーチンを起動して、画像を読み込む。読み込まれた画像の上に、多角形を作成する。
【０１０８】
次に、802に示すように、ポインティングデバイスのボタンが押されてから離されるまでのカーソルの軌跡の各点について、しきい値より暗い画像の点のうち、それぞれから最も近い暗い点を求める。
【０１０９】
803に示すように、まず、多角形の頂点が該点列の最も近い点に移動した後、これらの点列からベジェ曲線を計算する。
【０１１０】
最初に作成された多角形の頂点が画像の線の上から外れていた場合に有効な例である。
【０１１１】
【発明の効果】
本発明によれば、計算機に読み込まれた最初の原画について頂点のみを指定してベジェ曲線を自動的に生成し、２番目以降の原画について、先に作成された図形の頂点を移動し、原画の線の付近をドラッグすることにより、ベジェ曲線のコントロールポイントを再計算し、図形を修正することができる。従って、原画の線が途中で途切れていても問題が少なく、頂点位置は操作者が指定するため自動補間の際には自然な補間が得られ、ベジェ曲線のコントロールポイントは直接操作する必要がないため簡便にアニメーション映像を制作することができる。
【図面の簡単な説明】
【図１】本発明の実施例に係る図形作成システムと、ディスプレイに表示される画面表示例を示す図である。
【図２】実施例１の処理の流れ図を示す図である。
【図３】実施例１の画像トレースルーチンを説明する図である。
【図４】実施例１のベジェ曲線計算ルーチンを説明する図である。
【図５】実施例１のベジェ曲線計算ルーチンの説明を補足する図である。
【図６】実施例１の図形修正ルーチンを説明する図である。
【図７】実施例２ついて説明する図である。
【図８】実施例３ついて説明する図である。
【図９】従来手法について説明する図である。

Claims

計算機上の記憶手段に記憶され、デジタルデータ化され、かつ、表示装置に表示された第１の原画の輪郭をトレースするために、
前記記憶手段と前記表示装置とポインティングデバイスとに接続された演算装置において、前記第１の原画の輪郭上の第１の頂点を指定する前記ポインティングデバイスによる入力を受け付けるステップと、
該第１の頂点の位置と、該ポインティングデバイスが示す第２の頂点と、前記第１の原画の輪郭とに基づいて、前記第１の頂点と前記第２の頂点との間のベジェ曲線を生成するステップとを有し、
前記第１の原画について作成された第１のベジェ曲線と第２の原画とを表示装置上に重ねて表示するステップと、
前記ベジェ曲線と前記第２の原画とを表示装置上に重ねて表示された状態において、前記第２の原画の輪郭をトレースするように前記ベジェ曲線の頂点をポインティングデバイスでドラッグして変形操作を手動で行う際に、前記ポインティングデバイスが前記第１のベジェ曲線の頂点を選択してドラッグした場合に、該ポインティングデバイスの動きに合わせて前記頂点の位置を移動することにより図形変形処理を行うステップとを有することを特徴とする図形作成方法。
前記頂点の移動に合せて該頂点のベジェコントロールポイントを移動するステップを有することを特徴とする請求項１記載の図形作成方法。
計算機上の記憶手段に記憶され、デジタルデータ化され、かつ、表示装置に表示された第１の原画の輪郭をトレースするために、
前記記憶手段と前記表示装置とポインティングデバイスとに接続された演算装置において、前記第１の原画の輪郭上の第１の頂点を指定する前記ポインティングデバイスによる入力を受け付けるステップと、
該第１の頂点の位置と、該ポインティングデバイスが示す第２の頂点と、前記第１の原画の輪郭とに基づいて、前記第１の頂点と前記第２の頂点との間のベジェ曲線を生成するステップとを有し、
前記第１の原画について作成された第１のベジェ曲線と第２の原画とを表示装置上に重ねて表示するステップと、
前記ベジェ曲線と前記第２の原画とを表示装置上に重ねて表示された状態において、前記第２の原画の輪郭をトレースするように前記ベジェ曲線の頂点をポインティングデバイスでドラッグして変形操作を手動で行う際に、前記ポインティングデバイスによって示される位置と前記第１のベジェ曲線の頂点とが不一致と判断される場合には、前記ポインティングデバイスによって示される軌跡の各点から各々最も距離的に近く、かつ、前記輪郭画像を構成する複数の点の明度情報のうち所定のしきい値よりも低い明度最低の第１の点を求め、その第１の点の列からベジェ曲線を算出してそれを第２の原画をトレースする線とするステップとを有することを特徴とする図形作成方法。