(57)【特許請求の範囲】
【請求項１】
クライアントとサーバとの間で通信し、前記クライアントからの要求に応じて前記サーバから取得した画像を表示するデータ表示システムであって、
前記サーバは、
データを記憶する記憶部と、
前記記憶部から取得したデータを画像として生成し、前記生成した画像をスクロール可能な方向毎の領域に分割し、前記分割された領域を複数のブロックに分割してブロック毎の画像を生成し、前記生成されたブロック毎の画像を前記記憶部に記憶する画像管理部と、
前記クライアントからデータの識別情報を受信した場合、前記ブロックのサイズおよび各領域のスクロールされない固定領域の値を前記クライアントに送信し、
前記クライアントからデータの送信要求を受信した場合、前記ブロックの識別情報に基づいて該当する画像を前記クライアントに送信するデータ通信部と、を有し、
前記クライアントは、
前記サーバから前記ブロックのサイズおよび各領域の固定領域の値を受信した場合、表示部の画面サイズおよび前記ブロックのサイズに基づいて、該表示部に表示可能なブロック数を決定し、領域毎に前記決定されたブロック数分の前記ブロックの識別情報を前記サーバに送信する画面ブロック管理部と、
前記サーバから前記ブロックの識別情報に該当する画像を受信した場合、前記表示部に前記受信した画像を配置する画面ブロック配置部と、を有し、
前記画像管理部は、前記クライアントの表示部に表示された矩形状の画面上で、画面の四隅はスクロール不可の固定の領域であり、前記四隅以外の上部、下部、左部、および右部は線上にスクロール可能な領域であり、前記上部、下部、左部、および右部で囲まれた領域は平面内をスクロール可能な領域として管理し、
前記画面ブロック管理部は、スクロール操作で移動した量に応じて、前記クライアントのブロックの画像として不足している前記ブロックの識別情報を前記サーバに送信し、
前記画像管理部は、前記ブロックが異なる画像に更新された場合、前記更新されたブロックの識別情報を特定し、前記データ通信部は、前記更新されたブロックの識別情報に基づいて該当する画像を前記クライアントに送信し、前記画面ブロック配置部は、前記更新されたブロックの識別情報に該当する画像を、表示されている既存のブロックの画像と入れ替えて表示する
ことを特徴とするデータ表示システム。
【発明の詳細な説明】
【技術分野】
【０００１】
本発明は、携帯情報端末でのデータ表示を容易にする技術に関する。
【背景技術】
【０００２】
スマートフォン、タブレット型端末などの携帯情報端末の普及に伴い、業務システムのデータを携帯情報端末のＷｅｂブラウザから利用するニーズが増加している。例えば、特許文献１では、サーバベースコンピューティングで、クライアント装置にＷｅｂページなどの長大なデータをスクロールしながら表示させる方法が記載されている。
【先行技術文献】
【特許文献】
【０００３】
【特許文献１】特開２０１３−１７５２０６号公報
【発明の概要】
【発明が解決しようとする課題】
【０００４】
クライアント（携帯情報端末）側で長大なデータを見ようとすると、画面上のデータをスクロールした際に、見出しなどもスクロールされてしまうため何のデータであったか、ユーザにとって分かりにくい場合がある。例えば、大規模な作業プロジェクトの進捗状況がガントチャートで作成されている場合、ガントチャートの上部に日程欄があり、左側に各工程欄があるとする。ユーザが見たい箇所（進捗工程の箇所）をみようとすると、その日程欄、各工程欄も、画面内に表示されないため、日程欄・工程欄をみようとしてスクロール操作を繰り返すことが頻繁に生じる問題があった。
【０００５】
本発明は、前記した課題を解決するためになされたものであり、クライアントでのデータ表示を容易にし、しかも短時間に表示できるデータ表示システムを提供することを目的とする。
【課題を解決するための手段】
【０００６】
前記目的を達成するため、本発明のデータ表示システムは、クライアントとサーバとの間で通信し、クライアントからの要求に応じてサーバから取得した画像を表示するデータ表示システムであって、サーバは、データを記憶する記憶部と、記憶部から取得したデータを画像として生成し、生成した画像をスクロール可能な方向毎の領域に分割し、分割された領域を複数のブロックに分割してブロック毎の画像を生成し、生成されたブロック毎の画像を記憶部に記憶する画像管理部と、クライアントからデータの識別情報を受信した場合、ブロックのサイズおよび各領域のスクロールされない固定領域の値をクライアントに送信し、クライアントからデータの送信要求を受信した場合、ブロックの識別情報に基づいて該当する画像をクライアントに送信するデータ通信部と、を有し、クライアントは、サーバからブロックのサイズおよび各領域の固定領域の値を受信した場合、表示部の画面サイズおよびブロックのサイズに基づいて、該表示部に表示可能なブロック数を決定し、領域毎に決定されたブロック数分のブロックの識別情報をサーバに送信する画面ブロック管理部と、サーバからブロックの識別情報に該当する画像を受信した場合、表示部に受信した画像を配置する画面ブロック配置部と、を有し、
画像管理部は、クライアントの表示部に表示された矩形状の画面上で、画面の四隅はスクロール不可の固定の領域であり、四隅以外の上部、下部、左部、および右部は線上にスクロール可能な領域であり、上部、下部、左部、および右部で囲まれた領域は平面内をスクロール可能な領域として管理し、
画面ブロック管理部は、スクロール操作で移動した量に応じて、クライアントのブロックの画像として不足しているブロックの識別情報をサーバに送信し、
画像管理部は、ブロックが異なる画像に更新された場合、更新されたブロックの識別情報を特定し、データ通信部は、更新されたブロックの識別情報に基づいて該当する画像をクライアントに送信し、画面ブロック配置部は、更新されたブロックの識別情報に該当する画像を、表示されている既存のブロックの画像と入れ替えて表示することを特徴とする。本発明のその他の態様については、後記する実施形態において説明する。
【発明の効果】
【０００７】
本発明によれば、クライアントでのデータ表示を容易にし、しかも短時間に表示できる。
【図面の簡単な説明】
【０００８】
【図１】本発明の実施形態に係るデータ表示システムを示す図である。
【図２】比較例として１枚の画像としてデータを取得した場合の表示画面の例を示す図であり、（ａ）は初期画面を示す図であり、（ｂ）はスクロールした際の表示画面を示す図である。
【図３】実施形態に係るガントチャートの例を示す図である。
【図４】実施形態に係るリソースグラフの例を示す図である。
【図５】サーバに記憶されているデータ配列情報を示す図である。
【図６】クライアントの表示画面のブロックの配列を示す図である。
【図７】データ表示の処理を示すフローチャートである。
【図８】データブロック情報を示す図である。
【図９】画面ブロック情報を示す図である。
【図１０】ブロックの識別情報に基づきサーバで取得されるブロックを示す図である。
【図１１】ブロックの画像の配置方法を示す図である。
【図１２】スクロール操作をした際のブロックの識別情報を示す図である。
【図１３】スクロール操作をした際のブロックの識別情報に基づきサーバで取得されるブロックを示す図である。
【図１４】本実施形態に係る折れ線グラフの例を示す図である。
【図１５】本実施形態に係るデータ表示システムの処理フローを示す図であり、（ａ）は、Ｗｅｂシステムの処理フローであり、（ｂ）は本実施形態に係るサーバサイドで描画を行う場合の処理フローである。
【発明を実施するための形態】
【０００９】
以下、本発明の実施形態について図面を参照して詳細に説明する。
図１は、本発明の実施形態に係るデータ表示システムを示す図である。データ表示システム１００は、サーバ１０と、スマートフォン・タブレット型端末などの携帯情報端末であるクライアント２０とから構成される。サーバ１０とクライアント２０とは、ネットワークＮＷを介して通信可能である。
【００１０】
サーバ１０は、処理部１１、記憶部１４、クライアント２０と通信を行う通信部１９などから構成される。処理部１１は、画像管理部１２、データ通信部１３などから構成される。
【００１１】
画像管理部１２は、記憶部１４から取得したデータを画像として生成し、生成した画像をスクロール可能な方向毎の領域に分割し、分割された領域を複数のブロックに分割してブロック毎の画像を生成し、生成されたブロック毎の画像を記憶部１４に記憶する。
【００１２】
データ通信部１３は、クライアントからデータの識別情報であるデータＩＤを受信した場合、ブロックのサイズおよび各領域のスクロールされない固定領域の値をクライアント２０に送信し、クライアント２０からデータの送信要求を受信した場合、ブロックの識別情報であるブロックＩＤに基づいて該当する画像をクライアントに送信する。
【００１３】
記憶部１４には、ユーザが利用するデータ１５、データを複数にブロックに分割した際のデータの配列情報を示すデータ配列情報１６（図５参照）、クライアントからデータ要求のリクエストがあった際に送付されるデータのブロック情報であるデータブロック情報１７（図８参照）、ブロックの識別情報であるブロックＩＤに関連付けられたブロック画像１８などが記憶されている。
【００１４】
記憶部１４は、ＲＡＭ（Random Access Memory）・ＨＤＤ（Hard disk drive）装置などにより構成される。処理部１１は、ＣＰＵ（Central Processing Unit）によって、ＲＡＭ・ＨＤＤ上のプログラムを実行することで実現される。通信部１９は、ネットワークＮＷを介して、クライアント２０などと各種データ、コマンドを交換する。なお、図示していないが、入力部、表示部などを有する。
【００１５】
クライアント２０は、処理部２１、記憶部２４、表示部２７、入力部２８、サーバ１０と通信を行う通信部２９などから構成される。処理部２１は、画面ブロック管理部２２、画面ブロック配置部２３などから構成される。
【００１６】
画面ブロック管理部２２は、サーバ１０からブロックのサイズおよび各領域の固定領域の値を受信した場合、表示部２７の画面サイズおよびブロックのサイズに基づいて、表示部２７に表示可能なブロック数を決定し、領域毎に決定されたブロック数分のブロックの識別情報であるブロックＩＤをサーバ１０に送信する。画面ブロック配置部２３は、サーバ１０からブロックの識別情報であるブロックＩＤに該当する画像を受信した場合、表示部２７に受信した画像を配置する。
【００１７】
記憶部２４には、表示部２７に表示可能な画面サイズ情報２５、表示部２７の画面に表示する際の画面ブロック情報２６（図９参照）が記憶されている。
【００１８】
本実施形態に係るデータ表示システム１００は、サーバ上のデータベース（例えば記憶部１４）にデータが集約され、クライアント２０の要求によりデータを可視化し、クライアント２０に表示するシステムである。本実施形態のデータ表示システムについて、一般的なＷｅｂシステムと比較して、図１５を参照して説明する。
【００１９】
図１５は、本実施形態に係るデータ表示システムの処理フローを示す図であり、（ａ）は、Ｗｅｂシステムの処理フローであり、（ｂ）は本実施形態係るサーバサイドで描画を行う場合の処理フローである。
【００２０】
図１５（ａ）は、一般的な処理フローを抽象化したものである。ＭＶＣ（Model-View-Controller）のモデルビューコントローラを用いている場合、処理の中核を担う「Model」、表示・出力を司る「View」、入力を受け取ってその内容に応じて「View」と「Model」を制御する「Controller」の３要素の組み合わせでシステムが実装される。メインの処理は「Model」に実装し、「Model」は画面出力などを行わない。処理結果は「View」に渡され、画面表示などが行われる。ユーザからの入力は「Controller」が受け取り、何らかの処理が必要な場合は「Model」に依頼し、出力が必要な場合は「View」に依頼する方式である。
【００２１】
図１５（ａ）の場合、クライアントがＭＶＣアーキテクチャでの「View」に相当する。クライアントからのリクエストがあると、表示対象となるデータが「Model」となるサーバのデータベースから取得され、「Controller」がユーザの要求に応じてデータの加工などの処理を行う。その後、処理結果を表示するため、データをシリアライズし、「View」であるクライアントに転送する。クライアントは受け取ったデータをオブジェクトに復元したのち、各オブジェクトの表示位置などを計算しながら画面を描画する。しかしながら、スマートフォン・タブレット型端末などの携帯情報端末に対し、前記方式を用いると、描画、スクロールなどのユーザインターフェイス（ＵＩ）応答に時間がかかり、十分な操作性能が確保できない場合がある。
【００２２】
これに対し、図１５（ｂ）に示す本実施形態に係るサーバサイドで描画を行う場合の処理フローでは、クライアントの処理負荷を低減するため、負荷の高い描画処理をサーバサイドで実行するサーバサイドイメージレンダリング方式を用いる。描画結果は画像データとしてクライアントに転送される。これにより、クライアントの負荷は画像の表示のみとなり、クライアントの負荷が低減できる。また、低速性能しかないクライアントで行っていた処理を高速性能なサーバ上で実行することで処理時間の短縮を図ることができる。
【００２３】
次に、本実施形態の本願特徴を、図２、図３、図４を参照して説明する。
図２は、比較例として１枚の画像としてデータを取得した場合の表示画面の例を示す図であり、（ａ）は初期画面を示す図であり、（ｂ）はスクロールした際の表示画面を示す図である。図３は、実施形態に係るガントチャートの例を示す図である。
【００２４】
図２（ａ）に示すガントチャートには、上部に日程欄、左部に工程欄、中央部に各工程の進捗状況欄が表示されている。通常、Ｗｅｂページのように１枚の画像（文字情報を含む）として生成されているものをサーバ１０から取得し表示した場合、右下に表示されている内容を確認するために、画像を左上方向にユーザが画面を介してスクロール操作をすると、図２（ｂ）のように、上部の日程欄、左部の工程欄も一緒にスクロールされ画面内に表示されない。よって、ユーザはどの工程のどの日程の進捗状況であるか否かがわからない。このため、ユーザは、上部の日程欄をみるために画像を下にスクロール操作をする必要があり、また、左部の工程欄をみるために画像を右にスクロール操作をする必要があり、無駄なスクロール操作の必要がある。なお、ガントチャート上には、「詳細設計が遅れています。」などの管理者が記入したコメントが記載されている。
【００２５】
図３は、実施形態に係るガントチャートの例を示す図である。図３に示すガントチャートの場合、上部の日程欄は左右にスクロール可能な欄とし、左部の工程欄は上下にスクロール可能な欄とし、中央部の進捗状況欄は、左右および上下を含む２次元方向にスクロール可能な欄としている。このため、ユーザは、上部の日程欄をみるために画像を下方向にスクロール操作をする必要がなくなり、また、左部の工程欄をみるために画像を右にスクロール操作をする必要がなくなる。
【００２６】
図４は、実施形態に係るリソースグラフの例を示す図である。リソースグラフとは、例えば、プロジェクトの管理者が、各リソース（例えば、作業者）の割り当てを監視して効率的に作業負荷を均衡させるものとして利用される。下部にリソース項目欄、左部に割り当て負荷欄があり、中央部に割り当ての状況欄がある。図４に示す例では、下部のリソース項目欄は、左右にスクロール可能な欄とし、左部の割り当て負荷欄は、上下にスクロール可能な欄とし、中央部の状況欄は、左右および上下を含む２次元方向にスクロール可能な欄としている。このため、ユーザは、下部のリソース項目欄をみるために画像を上方向にスクロール操作をする必要がなくなり、また、左部の割り当て負荷欄をみるために画像を右にスクロール操作の必要がなくなる。すなわち、データ表示システム１００によれば、クライアントでのデータ表示を、ユーザにとってわかり易く表示できる。
【００２７】
本実施形態に係るデータ表示システム１００は、クライアント２０にデータを表示する際に、サーバ１０がＷｅｂページのように１枚の画像として送信するのではない。サーバ１０の画像管理部１２は、記憶部１４から取得したデータを画像として生成し、生成した画像をスクロール可能な方向毎の領域に分割し、分割された領域を複数のブロックに分割してブロック毎の画像を生成し、生成されたブロック毎の画像を記憶部１４に記憶している。そのため、クライアント２０のリクエストに応じて、短時間にクライアント２０に送信することができ、描画表示の遅れを最小限にすることができる。
【００２８】
次に、図３および図４のデータ表示方法について、詳細に説明する。
図５は、サーバに記憶されているデータ配列情報を示す図である。データ配列情報１６は、データ１５の画像をブロック毎に分割した際に、スクロール可能な方向に次元を有する配列として記憶部１４に保持される。図５に示すデータ配列情報１６は、トップレフト（ＴＬ）の領域、トップ（Ｔ）の領域、トップライト（ＴＲ）の領域、レフト（Ｌ）の領域、センター（Ｃ）の領域、ライト（Ｒ）の領域、ボトムレフト（ＢＬ）の領域、ボトム（Ｂ）の領域、ボトムライト（ＢＲ）の領域の９つの領域に分割されている。また、各領域はブロック毎に分割されており、各領域はスクロール可能な方向毎に分けて管理し、図５ではその方向毎に以下のように表示を分けて示す。
例えば、
ＴＬ、ＴＲ、ＢＬ、ＢＲの領域は、図ではクロス斜線表示、
Ｔ、Ｂの領域は、図では少し細かいドット表示、
Ｌ、Ｒの領域は、図では斜線表示、
Ｃの領域は、図では白色表示
である。
【００２９】
各領域は、前記したように、所定のサイズの画像のブロックに分割されており、画像のブロックはスクロール可能な方向に次元を有する配列としている。例えば、ＴＬの領域は上下方向および左右方向にスクロールしないため０次元（つまり、単体の１ブロック）として、記憶部１４に保持する。１方向にスクロールする領域（Ｔ，Ｌ，Ｒ，Ｂ）は１次元配列の形でブロックを分割する。中央部分はＸ方向（左右方向）およびＹ方向（上下方向）を含む２次元方向にスクロール可能な領域である。よって、例えば２次元配列として記憶部１４に保持する。
【００３０】
各領域のブロックの識別情報としてブロックＩＤを、（領域，Ｘ方向，Ｙ方向）として表現すると、
ＴＬの領域は、(TL,0,0)、
Ｔの領域は、 （T,0,0),(T,1,0),(T,2,0),・・・,(T,17,0),(T,18,0）、
ＴＲの領域は、(TR,0,0)、
Ｌの領域は、  (L,0,0),(L,0,1),(L,0,2),・・・,(L,0,14),(L,0,15)、
Ｃの領域は、  (C,0,0),(C,1,0),(C,2,0),・・・,(C,17,15),(C,18,15)、
Ｒの領域は、  (R,0,0),(R,0,1),(R,0,2),・・・,(R,0,14),(R,0,15)、
ＢＬの領域は、(BL,0,0)、
Ｂの領域は、 （B,0,0),(B,1,0),(B,2,0),・・・,(B,17,0),(B,18,0）、
ＢＲの領域は、(BR,0,0)となる。
【００３１】
すなわち、画像管理部１２は、クライアント２０の表示部２７に表示された矩形状の画面上（図６参照）で、画面の四隅はスクロール不可の固定の領域であり、四隅以外の上部、下部、左部、および右部は線上にスクロール可能な領域であり、上部、下部、左部、および右部で囲まれた領域は平面内をスクロール可能な領域として管理している。
【００３２】
図６は、クライアントの表示画面のブロックの配列を示す図である。クライアント２０は携帯情報端末であるため、表示部２７が小さく表示されるブロック数は制限される。例えば、２５個のブロックで形成される場合、図６に示す初期画面におけるブロックＩＤを示すと、
ＴＬの領域は、(TL,0,0)、
Ｔの領域は、 （T,0,0),(T,1,0),(T,2,0)、
ＴＲの領域は、(TR,0,0)、
Ｌの領域は、  (L,0,0),(L,0,1),(L,0,2)、
Ｃの領域は、  (C,0,0),(C,1,0),(C,2,0),
(C,0,１),(C,1,1),(C,2,1),
(C,0,2),(C,1,2),(C,2,2)、
Ｒの領域は、  (R,0,0),(R,0,1),(R,0,2)、
ＢＬの領域は、(BL,0,0)、
Ｂの領域は、（B,0,0),(B,1,0),(B,2,0)、
ＢＲの領域は、(BR,0,0)となる。
【００３３】
Ｔの領域およびＢの領域は左右にスクロール可能な領域であり、Ｌの領域およびＲの領域は上下にスクロール可能な領域であり、Ｃの領域は、左右方向・上下方向を含む２次元の方向にスクロール可能な領域である。なお、ＴＬの領域、ＴＲの領域、ＢＬの領域、ＢＲの領域は、固定領域となる。
【００３４】
次に、データ表示の処理について、図７〜図１３を参照して説明する。
図７は、データ表示の処理を示すフローチャートである。適宜図１を参照して説明する。クライアント２０は、サーバ１０に接続し、ユーザが表示する内容を識別するデータＩＤを送信する（ステップＳ４１）。サーバ１０は、リクエストを受信すると（ステップＳ３１）、データＩＤに該当するデータ１５を記憶部１４から取得し（ステップＳ３２）、取得したデータを画像として生成し、生成した画像をスクロール可能な方向毎の領域に分割し、分割された領域を複数のブロックに分割してブロック毎の画像を生成し、生成されたブロック毎の画像を記憶部１４に、ブロック画像１８として記憶する（ステップＳ３３）。
【００３５】
記憶部１４に記憶されているデータ１５は、例えば、ガントチャートであれば、各工程の進捗状況、その進捗状況におけるコメント、納期期限など文字情報を含めて１つのデータとなっている。このため、まずデータ１５をひとつの画像として生成し、その後に、図５に示したように領域毎に複数のブロックに分割してブロック毎の画像を生成する。これにより、「大量製品の在庫推移を一覧表示」するように製品毎にデータがブロック毎にきれいに分割可能なモデルだけでなく、全体が１枚のガントチャートとなるような分割が難しい場合にも適用できる。
【００３６】
サーバ１０は、クライアント２０への描画完了の準備ができると、描画完了通知をクライアント２０に送信するとともに、データブロック情報１７を送信する（ステップＳ３４）。
【００３７】
図８は、データブロック情報を示す図である。データブロック情報１７は、ブロックのサイズおよび各領域のスクロールされない固定領域の値などである。データブロック情報１７は、１ブロックのあたりの幅および高さと、固定領域の値として、上側にある上下方向にスクロールしない固定領域であるＴの領域の高さ、下側にある上下方向にスクロールしない固定領域であるＢの領域の高さ、左側にある左右方向にスクロールしない固定領域であるＬの領域の幅、右側にある左右方向にスクロールしない固定領域であるＲの領域の幅と、中央部分のＣの領域の幅および高さとを含んで構成される。具体的には、固定領域の値として、上側にあるＴの領域の高さ（Ｈ）が１００ピクセルである。同様に、左側にあるＬの領域の幅（Ｗ）が１００ピクセルである。図８に示す例の場合、Ｂの領域の高さが「０」（零）であるので、Ｂの領域が設定されていないことを示す。同様に、Ｒの領域の幅がゼロであるので、Ｒの領域が設定されていないことを示す。
【００３８】
図８の例では、１ブロックあたりの幅および高さ（すなわちサイズ）が均一になっているが、これに限定される必要はない。図５に示す上下左右にある固定領域（例えば、Ｔの領域、Ｂの領域、Ｌの領域、Ｒの領域）の幅および大きさはそれぞれ独立であり、また、中央部分にある領域（例えば、Ｃの領域）のブロックのサイズも独立である。例えば、中央部分の領域の１ブロックのサイズが１００×１００ピクセルであっても、上側の固定領域の高さは２８０などに設定可能である。
【００３９】
図７に戻り、クライアント２０の画面ブロック管理部２２は、サーバ１０からブロックのサイズおよび各領域の固定領域の値を含むデータブロック情報１７を受信した場合（ステップＳ４２）、表示部２７の画面サイズおよび受信したブロックのサイズに基づいて、表示部２７に表示可能な画面ブロック情報２６を生成する（ステップＳ４３）。すなわち、画面ブロック管理部２２は、画面表示可能なブロック数を決定し、データ送信要求とともに、領域毎に決定されたブロック数分の識別情報であるブロックＩＤをサーバ１０に送信する（ステップＳ４４）。
【００４０】
図９は、画面ブロック情報を示す図である。図９に示す画面ブロック情報２６は、スマートフォンに表示する場合について、例示した場合である。具体的には、画面サイズ情報２５（例えば、５００×５００ピクセル）と、図８に示すデータブロック情報１７とに基づくと、上側のＴの領域は、左右方向に４ブロックが配置され、左側のＬの領域は、上下方向に４ブロックが配置される。下側のＢの領域は高さが「０」であるので表示されず、また、右側のＲの領域は幅が「０」であるので表示されない。中央のＣの領域は、４ブロック×４ブロックが配置される。また、ＴＬの領域が左上に１ブロックのみ配置される。画面ブロック情報２６に記載がある各ブロックＩＤは、図５に示したブロックＩＤと対応している。
【００４１】
図９に示すように、固定領域を表示しないときは、幅および高さを「０」に設定することにより、表示したいデータ内容に対応して柔軟に画面構成を変えることができる。また、固定領域が隣接する場合、その境界にスクロールしない領域（図では、クロス斜線表示）を配置することにより、画面全体の表示領域が矩形として表示される。
【００４２】
また、画面のブロックのサイズとスクロールの単位は独立であり、例えば、画面のブロックのサイズが１００×１００の場合でも、上方向に１０ピクセルずつスクロールするような動作も可能である。
【００４３】
図７に戻り、画面ブロック管理部２２がサーバ１０にリクエスト要求する各ブロックＩＤは、図９に示した画面ブロック情報２６に基づき、
(TL,0,0)、
(T,0,0),(T,1,0),(T,2,0),(T,3,0)、
(L,0,0),(L,0,1),(L,0,2),(L,0,3), 
(C,0,0),(C,1,0),…,(C,2,3),(C,3,3)
である。
【００４４】
図７に戻り、サーバ１０はリクエスト要求を受信すると（ステップＳ３５）、リクエストされたブロックＩＤに該当する画像をクライアント２０に送信する（ステップＳ３６）。
【００４５】
図１０は、ブロックの識別情報に基づきサーバで取得されるブロックを示す図である。図１０に示すデータ配列情報１６に基づき、太線で囲んだ部分のブロックＩＤに該当する画像をクライアント２０に送信する。このとき、サーバ１０のデータ通信部１３は、ブロックＩＤと画像とを関連づけて送信する。
【００４６】
具体的には、ブロックＩＤのメタ情報を付加して、JavaScript（登録商標）のリテラル形式などを用いて、
{             
region:center,                   
xindex:0,                 
yindex,1,                 
imagedata:(画像データを文字列化したもの)              
}                    
などとする。そして、クライアント２０の画面ブロック配置部２３は、サーバ１０からブロックＩＤに該当する画像を受信した場合（ステップＳ４５）、表示部２７に受信した画像を配置する（ステップＳ４６）。
【００４７】
図１１は、ブロックの画像の配置方法を示す図である。クライアント２０では、各ブロックの画像を受信したタイミングで、該当する位置に配置する。画像には、その配置位置を特定可能なメタ情報が付加されているため、それを基にタイルのように並べることで、サーバ１０で生成した画像を、クライアント２０上で再現することができる。また、領域毎に分割して画像を送信しているため、領域毎にスクロールが可能な方向を制限しているため、固定領域を実現できる。
【００４８】
図７に戻り、画面ブロック管理部２２は、クライアント２０の画像上でスクロール操作を検知したか否かを判定し（ステップＳ４７）、スクロール操作が検知されない場合（ステップＳ４７，Ｎｏ）、ステップＳ４７に戻り、スクロール操作が検知された場合（ステップＳ４７，Ｙｅｓ）、ステップＳ４３に戻る。
【００４９】
図１２は、スクロール操作をした際のブロックの識別情報を示す図である。図１２に示す画面ブロック情報２６は、図９に示す画面ブロック情報２６と比較して、左上方向へ１ブロック分だけスクロール操作された状態である。この場合、ブロックの画像として不足しているブロックの識別情報であるブロックＩＤのリクエスト要求をする。具体的には、(T,4,0),(C,4,1),(C,4,2),(C,4,3),(C,4,4),(L,0,4),(C,1,4),(C,2,4),(C,3,4)である。
【００５０】
図１３は、スクロール操作をした際のブロックの識別情報に基づきサーバで取得されるブロックを示す図である。図１３に示すデータ配列情報１６に基づき、太線で囲んだ部分のブロックＩＤに該当する画像をクライアント２０に送信する。このとき、サーバ１０のデータ通信部１３は、ブロックＩＤと画像とを関連づけて送信する。
【００５１】
本実施形態のデータ表示システム１００によれば、図３でガントチャートの例、図４でリソースグラフの例について示したが、これに限定されるものではない。例えば、各種のグラフ（折れ線グラフ、散布グラフなど）の表示にも適用することができる。図１４は、本実施形態に係る折れ線グラフの例を示す図である。画面の左部の領域は、上下にスクロール可能なＬの領域であり、画面の左下の隅部の領域はスクロール不可のＢＬの領域であり、下部は左右にスクロール可能なＢの領域、他の領域は平面的にスクロール可能なＣの領域である。クライアント２０の画面上でスクロール操作がされても、Ｌの領域、ＢＬの領域およびＢの領域の見出しなどは常に表示されており、クライアント２０を利用するユーザにとって、クライアント２０はデータ表示をわかり易く表示することができる。
【００５２】
本実施形態では、サーバ１０の画像管理部１２が、ブロック毎の画像を作成し管理しているが、これに限定されるものではない。具体的には、画像管理部１２は、管理者などによりブロックの画像が異なる画像に更新された場合、更新されたブロックの識別情報を特定し、データ通信部１３は、更新されたブロックの識別情報に基づいて該当する画像をクライアント２０に送信する。クライアント２０の画面ブロック配置部２３は、更新されたブロックの識別情報に該当する画像を、表示されている既存のブロックの画像と入れ替えて表示する。これにより、クライアント２０を利用するユーザは、最新のデータをみることができる。
【符号の説明】
【００５３】
１０    サーバ
１１    処理部
１２    画像管理部
１３    データ通信部
１４    記憶部
１５    データ
１６    データ配列情報
１７    データブロック情報
１８    ブロック画像
２０    クライアント
２１    処理部
２２    画面ブロック管理部
２３    画面ブロック配置部
２４    記憶部
２５    画面サイズ情報
２６    画面ブロック情報
１００    データ表示システム
ＮＷ    ネットワーク
【図１】
0006002263.tif 000002
【図２】
0006002263.tif 000003
【図３】
0006002263.tif 000004
【図４】
0006002263.tif 000005
【図５】
0006002263.tif 000006
【図６】
0006002263.tif 000007
【図７】
0006002263.tif 000008
【図８】
0006002263.tif 000009
【図９】
0006002263.tif 000010
【図１０】
0006002263.tif 000011
【図１１】
0006002263.tif 000012
【図１２】
0006002263.tif 000013
【図１３】
0006002263.tif 000014
【図１４】
0006002263.tif 000015
【図１５】
0006002263.tif 000016