JP5026472B2 - 画像生成装置、画像生成装置の動作方法、および記録媒体 - Google Patents

Description

本発明は、ウェブページを高速に表示するための、いわゆるＣＳＳスプライト用の画像を効率的に生成する技術に関する。

ウェブページをクライアント端末にて高速に表示するための技術として、現在「ＣＳＳスプライト」と呼ばれる以下のような技術が提供されている。一般的にウェブページにはタイトル画像や項目画像、バナー広告、ＧＵＩ用ボタンなどの複数の細かい画像部品が埋め込まれている。そのため従来のウェブページの表示時には、これら画像部品の一つ一つに逐一ＨＴＴＰリクエストを行う必要があり、表示するまでに時間がかかっていた。そこでＣＳＳスプライトではこれら複数の画像部品を一つの大きな画像データ（以下、「矩形画像」と記載）にまとめて１回のＨＴＴＰリクエストで複数の画像部品を取得可能とし、ウェブページの表示時間を短縮することができる、という具合である。

特開２００７−１２２７２４号公報

ここで、画像の縦横長がばらばらの複数の画像を並べて１枚の画像データを生成する場合、その画像データは、配置で生じる余白も含めた矩形の画像データとなる。したがって余白を考慮せずに下手に並べてしまうと、矩形画像の縦横長が余白を含めて肥大化してしまい、その結果としてデータサイズ（データ量）も大きくなってしまうことになる。そして上記従来の技術においては、上記点を考慮していないためＣＳＳスプライト用の矩形画像のデータサイズが不必要に大きなものとなり、大きな矩形画像そのものの通信に時間がかかり表示時間の短縮効率が悪くなってしまう、という課題がある。

以上の課題を解決するために、本発明は、ＣＳＳスプライト用の矩形画像の表示面積が小さくなるよう、複数の画像を、同一平面上に個々の画像が重ならないように、かつ対角線が略最小となる矩形となるよう配置して矩形画像を生成する機能を有することで、矩形画像のデータサイズの肥大化を抑え、通信速度を確保することができるウェブページなどの表示用の画像生成装置を提供する。

具体的には、ウェブページにて表示される複数の画像をまとめて配信するための装置であって、複数の画像を、同一平面上に個々の画像が重ならないように、かつその複数の画像の全てを含む矩形の対角線が略最小となるよう配置する矩形画像生成部と、前記複数の画像を前記矩形画像生成部により配置された状態で配信する配信部と、を有する画像生成装置を提供する。

あるいは、上記構成に加えて、ウェブページにて表示される複数の画像を取得する画像データ取得部と、取得した複数の画像を、同一座標平面上において個々の画像が重ならないように、かつその複数の画像の全てを含む矩形の対角線が略最小となるよう配置するための配置ルールを保持する配置ルール保持部と、を有するとともに、前記矩形画像生成部は、前記配置ルールに従って複数の画像を配置するものであり、前記配置ルールが、計算機に、各画像の長辺及び短辺の長さを示す辺情報を取得する辺情報取得ステップと、取得した辺情報に基づいて、最大長辺の画像を、何れかの頂点が前記座標平面上の原点を配置開始点として占めるよう配置する最大画像配置ステップと、配置されている画像の占める座標以外の点であって、本配置されている画像について前記座標平面上の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点または、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を配置開始点として占めるように次に最大長辺を有する画像をそれぞれに仮配置する次画像仮配置ステップと、次画像仮配置ステップにて仮配置された画像のなかから前記座標平面上の原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置とする本配置ステップと、次画像仮配置ステップと、本配置ステップとを残り画像がなくなるまで繰り返し、残り画像がなくなったときに終了するステップと、を実行させるためのルールである画像生成装置も提供する。

以上のような構成をとる本発明によって、複数の画像を、同一平面上に個々の画像が重ならないように、かつ対角線が略最小となる矩形となるよう配置して表示面積の小さいＣＳＳスプライト用の画像データを生成することができる。したがって複数の画像を並べて配置した1枚の画像のデータサイズの肥大化を抑え、通信速度を確保することができる。

実施例１の画像生成装置によって生成される矩形画像の一例を表す図 実施例１の画像生成装置における機能ブロックの一例を表す図 実施例１の画像生成装置における矩形画像生成の一例を表す概念図 実施例１の画像生成装置における矩形画像生成の一例を表す概念図 実施例１の画像生成装置におけるハードウェア構成の一例を表す図 実施例１の画像生成装置における処理の流れの一例を表すフローチャート 実施例２の画像生成装置における機能ブロックの一例を表す図 実施例２の画像生成装置における処理の流れの一例を表すフローチャート

以下に、図を用いて本発明の実施の形態を説明する。なお、本発明はこれら実施の形態に何ら限定されるものではなく、その要旨を逸脱しない範囲において、種々なる態様で実施しうる。なお実施例１は、主に請求項１，２，４，５について説明する。また実施例２は、主に請求項３について説明する。

≪実施例１≫
<概要>
図１は本実施例の画像生成装置によって生成される矩形画像の一例を表す図である。この図１（ａ）にあるように、ウェブページの見栄えを良くするために、ページタイトルや項目名、各種操作用ボタン、あるいは写真、背景、広告画像などの各種画像データがページ内に表示される。そこで、本実施例の画像生成装置では、図１（ｂ）に示すように、複数の画像を重ならないよう効率よく配置して1枚の矩形画像の面積が小さくなるよう生成する。そして、このように面積が小さくなるよう配置して生成された矩形画像は、不必要に余白が生じ面積が大きい場合よりもデータサイズを小さくすることができるので、クライアント端末と高速に送信し表示させることができる。

<機能的構成>
図２は、本実施例の画像生成装置における機能ブロックの一例を表す図である。なお、以下に記載する本画像生成装置の機能ブロックは、ハードウェア、ソフトウェア、又はハードウェア及びソフトウェアの両方として実現され得る。具体的には、コンピュータを利用するものであれば、ＣＰＵ（中央演算装置）や主メモリ、バス、あるいは二次記憶装置（ハードディスクや不揮発性メモリ、ＣＤやＤＶＤなどの記憶メディアとそれらメディアの読取ドライブなど）、情報入力に利用される入力デバイス、印刷機器や表示装置、その他の外部周辺装置などのハードウェア構成部、またその外部周辺装置用のインターフェース、通信用インターフェース、それらハードウェアを制御するためのドライバプログラムやその他アプリケーションプログラム、ユーザ・インターフェース用アプリケーションなどが挙げられる。

そして主メモリ上に展開したプログラムに従ったＣＰＵの演算処理によって、入力デバイスやその他インターフェースなどから入力され、メモリやハードディスク上に保持されているデータなどが加工、蓄積されたり、上記各ハードウェアやソフトウェアを制御するための命令が生成されたりする。また、この発明は画像生成装置として実現できるのみでなく、方法としても実現可能である。また、このような発明の一部をソフトウェアとして構成することができる。さらに、そのようなソフトウェアをコンピュータに実行させるために用いるソフトウェア製品、及び同製品を記録媒体に固定した記録媒体も、当然にこの発明の技術的な範囲に含まれる（本明細書の全体を通じて同様である）。

そして、この図２にあるように、本実施例の「画像生成装置」（０２００）は、「画像データ取得部」（０２０１）と、「配置ルール保持部」（０２０２）と、「矩形画像生成部」（０２０３）と、「配信部」（０２０４）と、を有する。

「画像データ取得部」（０２０１）は、ウェブページにて表示される複数の画像を取得する機能を有し、例えばＣＰＵや主メモリ、通信回路、画像データ取得プログラムなどによって実現できる。具体的には、例えばリンクなどを辿りＵＲＬを自動参照するクローラなどの巡回型プログラム、あるいはユーザ入力などで指定されたＵＲＬを参照するプログラムの処理によって、参照先ＵＲＬからウェブページのＨＴＭＬ文書を取得する。そして、そのＨＴＭＬ文書内の例えばｉｍｇタグなどを特定し、そのｉｍｇタグの参照する画像アドレスから画像データを取得する、といった方法が挙げられる。あるいは、新規にウェブページを作る際に、例えばウェブページの作成者から複数の画像データを受付用アドレス宛に送信してもらうことで取得する方法なども挙げられる。また、画像生成装置がＷｅｂサーバ装置に組み込まれているのであれば、内部的に取得するよう構成し、外部から通信網を介して画像データを取得する構成は備えていなくとも良い。

「配置ルール保持部」（０２０２）は、配置ルールを保持する機能を有し、例えばＨＤＤ（ハードディスクドライブ）やフラッシュメモリ、その他の各種記録媒体によって実現することができる。また「配置ルール」とは、複数の画像を、同一座標平面上において個々の画像が重ならないように、かつその複数の画像の全てを含む対角線が略最小となる矩形となるよう配置するためのルールをいい、具体的には以下のようなルールが挙げられる。

図３および図４は、この配置ルールによって示される複数の画像の配置手順の一例について説明するための図である。なお配置処理に関しては、例えば「ビデオメモリ」をその複数の画像を配置するための配置平面とし、また、その配置平面（ビデオメモリ）の左上ピクセルを座標原点（０，０）として以下に説明する。

この図３（ａ）にあるように、上記画像データ取得部で取得された画像データを復号し、あるウェブページ内に表示される画像５枚が取得される。なお、それぞれの縦横のピクセル数は、画像１（６，３）、画像２（４，７）、画像３（３，３）、画像４（２，８）、画像５（８，５）である。すると配置ルールでは、まず、これら画像の長辺及び短辺の長さ（ピクセル数）を示す辺情報を取得する。つづいて辺情報から最大長辺「８ピクセル」を持つ画像４および画像５を特定する。ここで、最大長辺の長さが同じである画像が複数枚ある場合は、短辺の長さを比較し、短辺の長いほうを、ここでは画像５を最大長辺の画像とする。そして図３（ｂ）にあるように、配置平面上の原点（０，０）を配置開始点として、例えばその画像５の左上頂点が配置開始点を占めるよう配置する。なお画像の配置向きに関しては、前述のＣＳＳスプライトで画像の回転などの定義ができないため固定であるとする。

次に、配置されている画像５の占める座標以外の点であって、前記配置座標上の原点（０，０）から最も遠い画像５の頂点α（ｘ座標：７、ｙ座標：４）を基点とし、その基点αに隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標である点を第一の仮配置点（仮配置用の配置開始点）Ａ（８，０）とする。そして図３（Ｃ）にあるように、画像５の次に最大長辺を有する画像４（４Ａ）について、例えばその左上頂点が仮配置点Ａを占めるように仮配置する。また、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点（０，５）を第二の仮配置点とし、同じく図３（ｃ）に示すように仮配置点Ｂにも画像４（４Ｂ）を仮配置する。

つづいて、仮配置点Ａ、Ｂのうちから本配置点を決定するため、仮配置された画像４Ａおよび４Ｂに関して以下のことをＣＰＵの演算によって検証する。すなわち、仮配置された画像４Ａないし４Ｂが、他のすでに本配置されている画像（ここでは画像５のみ）と重なるか否か判断する。そして重なるとの判断結果が出力された場合には、その仮配置点は画像４に関する本配置用の配置開始点から除外する。その上で複数の仮配置点が残った場合には、図４（ａ）に示すように、仮配置された画像４Ａに関して座標原点から最も遠い頂点（ここでは右下頂点）と座標原点までの距離、および同じく画像４Ｂに関して座標原点から最も遠い頂点と座標原点までの距離を算出する。そして、その算出値の大小比較をＣＰＵの演算によって行い、もっとも小さい距離となる仮配置画像、ここでは画像４Ａを本配置とし、他の仮画像（ここでは４Ｂのみ）を削除する。

そして、画像４の次に最大長辺を有する画像２の本配置点を決定するため、図４（ｂ）にあるように上記同様にして、すでに本配置されている画像５および画像４から仮配置点Ｂ，Ｃ，Ｄを決定し、各点に画像２を仮配置する。そして上記検証を行い、その検証結果に従って図４（ｃ）に示すように画像２の本配置位置を決定する。つづいて、本配置された画像５、画像４、画像２から上記同様にして仮配置点を決定する。なお、ここで画像５について座標原点から最も遠い頂点α（７、４）を基点として仮配置点を決定する場合、ｙ＋１であるｙ座標５のピクセルラインにおいて、ｘ座標０から３のピクセルには画像２が配置されている。ここで、仮配置点は「配置されている画像の占める座標以外の点」であるので、仮配置点の一つは図４（ｃ）に示すように座標点Ｅ（４、５）となる。そして、その他の画像４や画像２についても、同様にその座標原点から最も遠い頂点を基点として仮配置点Ｄ，Ｆ，Ｇが特定される。そして仮配置点Ｄ〜Ｆのそれぞれに画像２の次に長辺が大きな画像１を仮配置し、仮配置された各画像に関して座標原点から最も遠い頂点と原点までの距離を比較する。そして、その距離が最も短くなる仮配置点Ｆを画像２の本配置点として、画像２を本配置する。そして、この処理を画像がなくなるまで繰り返し、残り画像がなくなったときに終了することで、図４（ｄ）にあるように複数の画像１〜５について、対角線が略最小となる矩形となるよう配置することができる。

なお上記処理に関して、仮配置点ＡやＢ、・・・を決定する処理は以下のように言い換えることができる。すなわち、すでに本配置されている各画像について、座標原点（０，０）から最も遠い頂点（ｘ，ｙ）の１ピクセルずつ外側の点を基点として、その基点から、まず座標平面のｘ軸方向に垂線を下ろす。そして基点を除いて最初に本配置された画像の辺と交差した点の１ピクセル下の点ａを求める。また画像と交差しなかった場合は、ｘ軸線と交差した点の１ピクセル下の点ａを求める。

続いて同じ基点からｙ軸方向に垂線を引き、最初に本配置された画像の辺と交差した点の１ピクセル右の点ｂを求める。また画像と交差しなかった場合は、ｙ軸線と交差した点の１ピクセル右の点ｂを求める。そして、これら求めた点ａ，ｂが基点と一致しなければ、それぞれ仮配置点Ａ，仮配置点Ｂなどとして決定する、という具合である。また、複数の仮配置点が１点に重なる場合は一つの仮配置点と見なして処理すると良い。

以上のように、複数の画像を配置する際に、画像同士が重ならないように、かつ各画像に関して座標原点から最も遠い頂点の距離が最小となるように配置していくことで、生成される矩形画像データ自体の対角線を略最小とすることができる、という具合である。

なお、上記配置ルールにおいては、最初の配置開始点である座標原点を配置平面（ビデオメモリ）の「左上」頂点とし、また、その配置開始点に対して最大長辺の画像の「左上」頂点を占めるよう配置する例を挙げて説明したが、もちろん左上のみならず右上、左下、右下のいずれであってもかまわない。そして、その場合は、前記座標原点や画像頂点位置に応じて処理位置や処理方向を反転するなど適宜変更したルールとすると良い。したがって、配置座標の原点から最も遠い頂点を（ｘ，ｙ）とした場合の「ｘ＋１」とは相対的な演算処理であり、具体的にはｘの１ピクセル外側（座標原点よりも遠い側）のｘ座標の値を算出する演算処理を意味する。

「矩形画像生成部」（０２０３）は、前記保持されている配置ルールに従って、前記取得した複数の画像を同一平面上に個々の画像が重ならないように、かつその複数の画像の全てを含む矩形の対角線が略最小となるよう配置する機能を有し、例えばＣＰＵや主メモリ、フレームメモリ、矩形画像生成プログラムなどによって実現することができる。そして、ここで配置ルールに従い生成された例えば図４（ｄ）に示すような矩形画像が、前述のＣＳＳスプライト用の画像として、例えば以下のスライス（分離）用の座標情報と合わせて出力される、という具合である。

「配信部」（０２０４）は、前記複数の画像を矩形画像生成部（０２０３）により配置された情報で配信する機能を有し、例えば、ＣＰＵや主メモリ、通信回路や配信プログラムによって実現できる。具体的に、この配信部では、例えば下記のようにして前記複数の画像を配信すると良い。すなわち、前述のＣＳＳスプライトでは、ウェブページを表示する際には矩形画像から元の各画像をスライス（分離）する必要があり、ＨＴＭＬ文書内のスタイルシートの「ｂａｃｋｇｒｏｕｎｄ」プロパティにて各画像の矩形画像内での座標情報を指定することになる。そこで矩形画像を生成する際に、例えば各画像を配置した際の左上の頂点座標および辺情報を取得する。

つづいて、例えば矩形画像生成部により配置された複数の画像を１枚の画像データとして符号化し、上記座標情報と合わせて配信部から、当該画像を含むウェブページの管理者の端末などに対して配信する、という具合である。そしてこのようにして出力された座標情報を、例えばウェブページの管理者がスタイルシートとしてウェブページのＨＴＭＬ文書内に記述することで、同時に出力された矩形画像を利用して、高速でウェブページの表示を行うことができる。

<ハードウェア構成>
図５は、上記機能的な各構成要件をハードウェアとして実現した際の、画像生成装置における構成の一例を表す概略図である。この図を利用して矩形画像の生成処理におけるそれぞれのハードウェア構成部の働きについて説明する。

この図にあるように、画像生成装置は、画像データ取得部、矩形画像生成部、配信部、またその他の各種演算処理を実行するための「ＣＰＵ」（０５０１）と、「主メモリ」（０５０２）と、を備えている。また配置ルール保持部である「フラッシュメモリ」（０５０３）も備えている。また、インターネットを介して情報を送受信するための「通信回路」（０５０４）や、画像処理をする際にピクセルデータを展開する「フレームメモリ」（０５０５）なども備えている。そしてそれらが「システムバス」などのデータ通信経路によって相互に接続され、情報の送受信や処理を行う。

また、「主メモリ」にはプログラムが読み出され、「ＣＰＵ」は読み出された当該プログラムを参照し、プログラムで示される手順に従い各種演算処理を実行する。また、この「主メモリ」や「フラッシュメモリ」にはそれぞれ複数のアドレスが割り当てられており、「ＣＰＵ」の演算処理においては、そのアドレスを特定し格納されているデータにアクセスすることで、データを用いた演算処理を行うことが可能になっている。

ここで、例えばＣＰＵが画像データ取得プログラムの一例であるクローラプログラムを解釈し、その解釈結果にしたがって「通信回路」を介して所定のＵＲＬへのアクセス処理を実行する。そして、アクセス先のウェブページのＨＴＭＬ文書データを解析し、タグなどを参照して当該ウェブページにて表示される画像データを複数取得する。そして、取得した複数の画像データを「主メモリ」のアドレス１，２、・・・に格納する。

つづいて「ＣＰＵ」は矩形画像生成プログラムを解釈し、「フラッシュメモリ」に保持されている配置ルールを「主メモリ」のアドレス３に読み出す。そして、当該配置ルールで示される手順に従って、まず「主メモリ」のアドレス１，２、・・・に格納されている画像データの縦横のピクセルサイズを、例えば情報ヘッダや復号した画像そのものなどを参照して特定する。つづいて、各画像について長辺の大小比較を「ＣＰＵ」の演算処理によって行い、最大長辺の画像データ１を特定する。また、同じ最大長辺の画像がある場合には、今度はそれぞれの短辺の大小比較を行い、最大長辺かつ最大短辺の画像データ１を特定する。また、長辺短辺とも同じ画像が複数あれば、例えば取得順など適宜優先順位を定めて、一の画像データ１を特定する。そして、「フレームメモリ」を配置座標平面として、特定した画像データ１を復号し生成した画像１を、例えばその左上頂点が配置座標の原点（０，０）を配置開始点として占めるよう配置する。

つづいて「ＣＰＵ」の演算処理によって、「フレームメモリ」上で画像１によって占められる座標以外の点であって、配置座標の原点から最も遠い画像１の頂点α（ｘ，ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標である点を第一の仮配置点Ａと決定する。そして画像１の次に最大長辺を有する画像２をデータから復号生成し、その左上頂点が仮配置点Ａを占めるように画像２Ａを仮配置する。また、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を第二の仮配置点とし、仮配置点Ｂにも画像２Ｂを仮配置する。

つづいて、仮配置点Ａ、Ｂのうちから本配置点を決定するため以下の処理をＣＰＵの演算によって実行する。すなわち、仮配置された画像２Ａないし２Ｂが、他のすでに本配置されている画像と重なるか否か判断する。そして重なるとの判断結果が出力された場合には、その仮配置点は画像２に関する本配置用の配置開始点から除外する。ここでは画像同士の重なりは無いので、つづいて仮配置された画像２Ａの原点から最も遠い頂点と原点までの距離（の２乗）を「ＣＰＵ」の演算処理によって算出し、「主メモリ」のアドレス４に格納する。また、同様に画像２Ｂの原点から最も遠い頂点と原点までの距離を「ＣＰＵ」の演算処理によって算出し、「主メモリ」のアドレス５に格納する。そして両算出値の大小比較をＣＰＵの演算によって行い、もっとも小さい距離となる仮配置画像、ここでは画像２Ａを本配置と決定する。そして、その決定結果にしたがって「フレームメモリ」上の他の仮画像２Ｂを削除する。

そして、上記各画像の長辺の長さ順に、画像３、画像４、画像５、・・・の本配置点を決定するため、上記同様の処理を繰返し各画像の本配置位置を決定する。そして、この処理を画像がなくなるまで繰り返し、残り画像がなくなったときに終了することで、取得した複数の画像について、対角線が略最小となる矩形となるよう配置して連結した矩形画像を「フレームメモリ」上に生成する。

つづいて、「ＣＰＵ」は配信プログラムを解釈し、その解釈結果にしたがって、例えば、まずフレームメモリに配置された各画像の左上の座標情報を取得し、「主メモリ」のアドレス６に格納する。そして、「フレームメモリ」上の矩形画像を所定の符号化アルゴリズムにしたがい「ＣＰＵ」の演算処理によって符号化し、「主メモリ」のアドレス７に格納する。そして「主メモリ」のアドレス６と７に格納されている座標情報と矩形画像データを関連付け、「通信回路」から出力配信する、という具合である。

そして出力された座標情報と矩形画像データを利用して、例えばスタイルシートを作成しそれをウェブページのＨＴＭＬ文書内に記述し、矩形画像データをウェブページの「ｉｍｇタグ」での参照先に設定する。このようにしてクライアント端末から当該ウェブページにアクセスがあった際には複数の画像をコンパクトにまとめた１枚の画像データの送信のみで済むため、高速でウェブページの表示を行うことができる。

<処理の流れ>
図６は、本実施例の画像生成装置における処理の流れの一例を表すフローチャートである。なお、以下に示すステップは、上記のような計算機の各ハードウェア構成によって実行されるステップであっても良いし、媒体に記録され計算機を制御するためのプログラムを構成する処理ステップであっても構わない。

この図にあるように、まず、例えばクローラプログラムによる自動巡回収集やユーザからの送信受付などによって、ウェブページにて表示される複数の画像の画像データを取得する（ステップＳ０６０１）と、予めフラッシュメモリなどに保持されている配置ルールを取得する（ステップＳ０６０２）。そして、その配置ルールに規定される手順（ステップ）にしたがって、取得した各画像の長辺及び短辺の長さを示す辺情報を取得する（ステップＳ０６０３）。つづいて取得した辺情報に基づいて、最大長辺の画像を、配置座標の原点を配置開始点として占めるようフレームメモリ上などに配置し（ステップＳ０６０４）、配置されている画像の占める座標以外の点であって、本配置されている各画像について前記配置座標の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点を特定する。またｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を配置開始点として特定する。そして、前記特定した各点Ａ，Ｂのそれぞれを占めるように次に最大長辺を有する画像をそれぞれ仮配置する（ステップＳ０６０５）。

つづいて、前記ステップＳ０６０５にて仮配置されたそれぞれの画像のなかから原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置し、他の仮画像をフレームメモリ上から削除する（ステップＳ０６０６）。そして、残りの画像がなくなるまでステップＳ０６０５と、ステップＳ０６０６の処理を繰り返す（ステップＳ０６０７）。そして、このようにして前記複数の画像を、その配置した状態で配信する。具体的には、例えば、前記配置状態での矩形画像を取得し（ステップＳ０６０８）、前記矩形画像から各画像を分離するための座標情報を取得し（ステップ０６０９）、前記矩形画像を符号化した矩形画像データと前記取得した座標情報と、を関連付けて出力する（ステップＳ０６１０）。

<効果の簡単な説明>
以上のように、本実施例の画像生成装置によって、複数の画像を、同一平面上に個々の画像が重ならないように、かつ対角線が略最小となる矩形となるよう配置して、表示面積の小さいＣＳＳスプライト用の矩形画像を生成することができる。したがって矩形画像のデータサイズ肥大化を抑え、通信速度を確保することができる。

≪実施例２≫
<概要>
本実施例は、上記実施例１と同様に、ＣＳＳスプライトなどで利用できるように、ウェブページに表示される複数の画像に関して、同一平面上に個々の画像が重ならないように、かつ矩形画像データの対角線が略最小となるよう配置して1枚の矩形画像を生成する機能を有する画像生成装置である。なお実施例１との相違点は、本実施例の画像生成装置が配置ルールを保持していない点であり、その替わりに配置ルールで規定される各ステップを実行する機能的な構成要件を有していることを特徴とする。

<機能的構成>
図７は、本実施例の画像生成装置における機能ブロックの一例を表す図である。この図にあるように、本実施例の「画像生成装置」（０７００）は、実施例１と同様に「画像データ取得部」（０７０１）と、「配信部」（０７０２）と、を有する。なお、これらの構成要件は、上記実施例１の同名の構成要件と同様であるので、その説明は省略する。

また本実施例の画像生成装置は、さらに「辺情報取得部」（０７０３）と、「最大画像配置部」（０７０４）と、「次画像仮配置部」（０７０５）と、「本配置部」（０７０６）と、「繰返制御部」（０７０７）と、を有する。なお、これらの構成要件は、上記実施例１の配置ルールで示される各手順（ステップ）を実現するための構成要件である。すなわち、「辺情報取得部」（０７０３）は、取得した各画像の長辺及び短辺の長さを示す辺情報を取得する機能を有する。「最大画像配置部」（０７０４）は、取得した辺情報に基づいて、最大長辺の画像を、配置座標の原点を配置開始点として占めるよう配置する機能を有する。「次画像仮配置部」（０７０５）は、配置されている画像の占める座標以外の点であって、本配置されている各画像について前記配置座標の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点または、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を配置開始点として占めるように次に最大長辺を有する画像をそれぞれに仮配置する機能を有する。そして、「本配置部」（０７０６）は、次画像仮配置部にて仮配置された画像のなかから原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置し、他の仮画像を削除する機能を有する。また「繰返制御部」（０７０７）は、次画像仮配置部での仮配置と、本配置部での本配置とを残り画像がなくなるまで繰り返し、残り画像がなくなったときに終了するよう制御する機能を有する。なお、上記各構成要件は、ＣＰＵや主メモリ、および各機能を実現するためのプログラムなどによって実現することができる。

そして前述のように、上記各構成要件の機能は、実施例１にて図３および図４を用いて説明した配置ルールに従った処理により実現されるものと同様であるので、その詳細な説明は省略する。そして、「矩形画像取得部」（０７０８）にて、前記複数の画像を配置し生成された矩形画像を取得する、という具合である。

<処理の流れ>
図８は、本実施例の画像生成装置における処理の流れの一例を表すフローチャートである。この図にあるように、まず、例えばクローラプログラムやユーザからの送信受付などによって、ウェブページにて表示される複数の画像の画像データを取得する（ステップＳ０８０１）と、取得した各画像の長辺及び短辺の長さを示す辺情報を取得する（ステップＳ０８０２）。つづいて取得した辺情報に基づいて、最大長辺の画像を、配置座標の原点を配置開始点として占めるようフレームメモリ上などに配置し（ステップＳ０８０３）、配置されている画像の占める座標以外の点であって、本配置されている各画像について前記配置座標の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点を特定する。またｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点として配置開始点を特定する。そして、前記特定した各点Ａ，Ｂのそれぞれを占めるように次に最大長辺を有する画像をそれぞれ仮配置する（ステップＳ０８０４）。

つづいて、前記ステップＳ０８０４にて仮配置されたそれぞれの画像のなかから原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置し、他の仮画像をフレームメモリ上から削除する（ステップＳ０８０５）。そして、残りの画像がなくなるまでステップＳ０８０４と、ステップＳ０８０５の処理を繰り返す（ステップＳ０８０６）。そして、このようにして前記複数の画像を、その配置した状態で配信する。具体的には、例えば、前記配置状態での矩形画像を取得し（ステップＳ０８０７）、前記矩形画像から各画像を分離するための座標情報を取得し（ステップ０８０８）、前記矩形画像を符号化した矩形画像データと前記取得した座標情報と、を関連付けて出力する（ステップＳ０８０９）。

<効果の簡単な説明>
以上のように、本実施例の画像生成装置によっても複数の画像を、同一平面上に個々の画像が重ならないように、かつ対角線が略最小となる矩形となるよう配置して、表示面積の小さいＣＳＳスプライト用の矩形画像を生成することができる。したがって矩形画像のデータサイズ肥大化を抑え、通信速度を確保することができる。

０２００ 画像生成装置
０２０１ 画像データ取得部
０２０２ 配置ルール保持部
０２０３ 矩形画像生成部
０２０４ 配信部

Claims (4)

1. ウェブページ上で位置的に離れて表示される複数の画像をまとめて配信するためのサーバ機能を有する画像生成装置であって、
   複数の画像を、同一平面上に個々の画像が重ならないように、かつその複数の画像の全てを含む矩形の対角線が略最小となるよう配置する矩形画像生成部と、
   前記複数の画像を前記矩形画像生成部により配置された状態で端末装置に対してネットワークを介して配信する配信部と、
   ウェブページ上で位置的に離れて表示される複数の画像を取得する画像データ取得部と、
   取得した複数の画像を、同一座標平面上において個々の画像が重ならないように、かつその複数の画像の全てを含む矩形の対角線が略最小となるよう配置するための配置ルールを保持する配置ルール保持部と、を有するとともに、
   前記矩形画像生成部は、前記配置ルールに従って複数の画像を配置するものであり、
   前記配置ルールは、計算機に、
   各画像の長辺及び短辺の長さを示す辺情報を取得する辺情報取得ステップと、
   取得した辺情報に基づいて、最大長辺の画像を、何れかの頂点が前記座標平面上の原点を配置開始点として占めるよう配置する最大画像配置ステップと、
   配置されている画像の占める座標以外の点であって、本配置されている画像について前記座標平面上の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点または、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を配置開始点として占めるように次に最大長辺を有する画像をそれぞれに仮配置する次画像仮配置ステップと、
   次画像仮配置ステップにて仮配置された画像のなかから前記座標平面上の原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置とする本配置ステップと、
   次画像仮配置ステップと、本配置ステップとを残り画像がなくなるまで繰り返し、残り画像がなくなったときに終了するステップと、を実行させるためのルールである画像生成装置。
2. ウェブページ上で位置的に離れて表示される複数の画像をまとめて配信するためのサーバ機能を有する画像生成装置であって、
   複数の画像を、同一平面上に個々の画像が重ならないように、かつその複数の画像の全てを含む矩形の対角線が略最小となるよう配置する矩形画像生成部と、
   前記複数の画像を前記矩形画像生成部により配置された状態で端末装置に対してネットワークを介して配信する配信部と、
   ウェブページ上で位置的に離れて表示される複数の画像を取得する画像データ取得部と、
   取得した各画像の長辺及び短辺の長さを示す辺情報を取得する辺情報取得部と、
   取得した辺情報に基づいて、最大長辺の画像を、何れかの頂点が前記座標平面上の原点を配置開始点として占めるよう配置する最大画像配置部と、
   配置されている画像の占める座標以外の点であって、本配置されている画像の全てについて前記座標平面上の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点または、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を配置開始点として占めるように次に最大長辺を有する画像をそれぞれに仮配置する次画像仮配置部と、
   次画像仮配置ステップにて仮配置された画像のなかから前記座標平面上の原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置する本配置部と、
   次画像仮配置部による前記仮配置と、本配置部による前記本配置とを残り画像がなくなるまで繰り返し、残り画像がなくなったときに終了するよう制御する繰返制御部と、
   を有する画像生成装置。
3. ウェブページ上で位置的に離れて表示される複数の画像をまとめて配信するためのサーバ機能を有する画像生成装置の動作方法であって、
   ウェブページ上で位置的に離れて表示される複数の画像を取得する画像データ取得ステップと、
   取得した各画像の長辺及び短辺の長さを示す辺情報を取得する辺情報取得ステップと、
   取得した辺情報に基づいて、最大長辺の画像を、何れかの頂点が前記座標平面上の原点を配置開始点として占めるよう配置する最大画像配置ステップと、
   配置されている画像の占める座標以外の点であって、本配置されている画像の全てについて前記座標平面上の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点または、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を配置開始点として占めるように次に最大長辺を有する画像をそれぞれに仮配置する次画像仮配置ステップと、
   次画像仮配置ステップにて仮配置された画像のなかから前記座標平面上の原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置とする本配置ステップと、
   次画像仮配置ステップと、本配置ステップとを残り画像がなくなるまで繰り返し、残り画像がなくなったときに終了するよう制御する繰返制御ステップと、
   前記複数の画像を本配置された状態で端末装置に対してネットワークを介して配信する配信ステップと、
   を計算機に実行させる画像生成装置の動作方法。
4. ウェブページ上で位置的に離れて表示される複数の画像をまとめて配信するためのプログラムを記録した記録媒体であって、
   ウェブページ上で位置的に離れて表示される複数の画像を取得する画像データ取得ステップと、
   取得した各画像の長辺及び短辺の長さを示す辺情報を取得する辺情報取得ステップと、
   取得した辺情報に基づいて、最大長辺の画像を、何れかの頂点が前記座標平面上の原点を配置開始点として占めるよう配置する最大画像配置ステップと、
   配置されている画像の占める座標以外の点であって、本配置されている画像の全てについて前記座標平面上の原点から最も遠い頂点（ｘ,ｙ）に隣接しｘ座標がｘ＋１であって、ｙ座標がもっとも小さい座標であるＡ点または、ｙ座標がｙ＋１の座標であって、ｘ座標がもっとも小さい座標であるＢ点を配置開始点として占めるように次に最大長辺を有する画像をそれぞれに仮配置する次画像仮配置ステップと、
   次画像仮配置ステップにて仮配置された画像のなかから前記座標平面上の原点から最も遠い頂点までの距離がもっとも小さい距離である頂点を含み、他のすでに本配置されている画像と重ならない画像を本配置とする本配置ステップと、
   次画像仮配置ステップと、本配置ステップとを残り画像がなくなるまで繰り返し、残り画像がなくなったときに終了するよう制御する繰返制御ステップと、
   前記複数の画像を本配置された状態で配信する端末装置に対してネットワークを介して配信ステップと、
   を記録した計算機に読み取り可能な記録媒体。

Images