(57)【要約】モバイル端末における、ＳＷＦデータを自身が解釈可能なデータに変換して表示する速度を向上させる。ＨＴＭＬおよびｊａｖａｓｃｒｉｐｔに対応したＷｅｂブラウザを有するモバイル端末が提供される。モバイル端末は、ＨＴＭＬのベクターシェイプフォーマットのデータとｊａｖａｓｃｒｉｐｔ関数との第１の対応関係を記憶するメモリと、ＨＴＭＬデータからＳＨＡＰＥを表すベクターシェイプフォーマットのデータを抽出し、第１の対応関係に従ってＳＨＡＰＥを表す初出のベクターシェイプフォーマットのデータに基づいて対応するｊａｖａｓｃｒｉｐｔ関数を定義し、ＳＨＡＰＥを表すベクターシェイプフォーマットのデータをｊａｖａｓｃｒｉｐｔコードへと変換するためのプロセッサとを備える。
2013179352.tif 000002
【特許請求の範囲】
【請求項１】
ベクターシェイプフォーマットおよびｊａｖａｓｃｒｉｐｔに対応したモバイル端末であって、
ベクターシェイプフォーマットのデータとｊａｖａｓｃｒｉｐｔ関数との第１の対応関係を記憶するメモリと、
ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを取得し、前記第１の対応関係に従って初出のＳＨＡＰＥのベクターシェイプフォーマットのデータに基づいて対応するｊａｖａｓｃｒｉｐｔ関数を定義し、既出のＳＨＡＰＥのベクターシェイプフォーマットのデータを前記ｊａｖａｓｃｒｉｐｔコードへと変換するためのプロセッサとを備える、モバイル端末。
【請求項２】
前記モバイル端末はディスプレイをさらに備え、
前記プロセッサは、前記変換後のｊａｖａｓｃｒｉｐｔコードに基づいて前記ディスプレイに前記ＳＨＡＰＥを表示させる、請求項１に記載のモバイル端末。
【請求項３】
前記モバイル端末は、ＦＬＡＳＨデータを受信するための通信インターフェイスをさらに備え、
前記メモリは、ＦＬＡＳＨデータとＨＴＭＬデータとの第２の対応関係を記憶し、
前記プロセッサは、同一のＳＨＡＰＥを表すデータを認識可能なように、受信したＦＬＡＳＨデータを前記第２の対応関係に従って前記ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを含むＨＴＭＬデータへと変換する、請求項１または２に記載のモバイル端末。
【請求項４】
ベクターシェイプフォーマットおよびｊａｖａｓｃｒｉｐｔに対応したモバイル端末のプロセッサに、
ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを取得するステップと、
予め定められた第１の対応関係に従って初出のＳＨＡＰＥのベクターシェイプフォーマットのデータに基づいて対応するｊａｖａｓｃｒｉｐｔ関数を定義するステップと、
既出のＳＨＡＰＥのベクターシェイプフォーマットのデータを前記ｊａｖａｓｃｒｉｐｔコードへと変換するステップとを実行させる、変換プログラム。
【請求項５】
前記プログラムは、前記モバイル端末に、前記変換後のｊａｖａｓｃｒｉｐｔコードに基づいてディスプレイに前記ＳＨＡＰＥを表示させるステップをさらに実行させる、請求項４に記載の変換プログラム。
【請求項６】
前記プログラムは、前記モバイル端末に、
ＦＬＡＳＨデータを受信するステップと、
同一のＳＨＡＰＥを表すデータを認識可能なように、受信したＦＬＡＳＨデータを予め定められた第２の対応関係に従って前記ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを含むＨＴＭＬデータへと変換するステップとをさらに実行させる、請求項４または５に記載の変換プログラム。
【請求項７】
ベクターシェイプフォーマットおよびｊａｖａｓｃｒｉｐｔに対応したモバイル端末によって実現される変換方法であって、
ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを取得するステップと、
予め定められた第１の対応関係に従って初出のＳＨＡＰＥのベクターシェイプフォーマットのデータに基づいて対応するｊａｖａｓｃｒｉｐｔ関数を定義するステップと、
既出のＳＨＡＰＥのベクターシェイプフォーマットのデータを前記ｊａｖａｓｃｒｉｐｔコードへと変換するステップとを備える、変換方法。
【請求項８】
前記変換後のｊａｖａｓｃｒｉｐｔコードに基づいてディスプレイに前記ＳＨＡＰＥを表示させるステップをさらに備える、請求項７に記載の変換方法。
【請求項９】
ＦＬＡＳＨデータを受信するステップと、
同一のＳＨＡＰＥを表すデータを認識可能なように、受信した前記ＦＬＡＳＨデータを予め定められた第２の対応関係に従って前記ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを含むＨＴＭＬデータへと変換するステップとをさらに備える、請求項７または８に記載の変換方法。
【発明の詳細な説明】
【技術分野】
【０００１】
本発明は、シェイプを示すためのデータを、ブラウザがより高速にシェイプを出力できる形式へと変換するための技術に関する。
【背景技術】
【０００２】
従来から、インターネットなどを介してＳＷＦデータをダウンロードし、当該ＳＷＦデータに基づいてディスプレイに動画を表示する端末が知られている。たとえば、特開２００６−３４４１３４号公報（特許文献１）には、通信端末用画像作成方法及び装置並びにサービスが開示されている。具体的には、特許文献１には、情報記録手段と、情報演算手段、情報入出力手段、情報表示手段、情報通信手段とを有し、ＳＷＦファイルを再生表示可能なユーザ用の通信端末と、ネットワークを介してそのユーザ用通信端末と接続され情報の授受を行なうネットワーク上の端末と、それら各端末の間での通信を可能にするネットワークとを少なくとも備えたシステムにおいて、ユーザ用通信端末で、その情報表示手段に表示する画像を作成するに当たり、その画像の構成要素となる単数或いは複数のＳＷＦファイルをプログラムコードに変換し、それを背景となる画像ファイルに結合し、次いで、それを1つのＳＷＦファイルとして生成することが記載されている。
【先行技術文献】
【特許文献】
【０００３】
【特許文献１】特開２００６−３４４１３４号公報
【発明の概要】
【発明が解決しようとする課題】
【０００４】
しかしながら、モバイル端末は、ＳＷＦデータを直接的に実行するためのソフトが搭載されていないことがある。あるいは、モバイル端末は、据置型端末に比べて、ＣＰＵ（Central  Processing  Unit）の処理能力やメモリの容量が少ないため、ＳＷＦデータを、自身が解釈可能なデータに変換して表示する速度が遅い場合がある。本発明は、かかる問題を解決するためになされたものであり、その目的は、モバイル端末における、ＳＷＦデータを自身が解釈可能なデータに変換して表示する速度を向上させることにある。
【課題を解決するための手段】
【０００５】
この発明のある局面に従うと、ベクターシェイプフォーマットおよびｊａｖａｓｃｒｉｐｔに対応したモバイル端末が提供される。モバイル端末は、ベクターシェイプフォーマットのデータとｊａｖａｓｃｒｉｐｔ関数との第１の対応関係を記憶するメモリと、ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを取得し、第１の対応関係に従って初出のＳＨＡＰＥのベクターシェイプフォーマットのデータに基づいて対応するｊａｖａｓｃｒｉｐｔ関数を定義し、既出のＳＨＡＰＥのベクターシェイプフォーマットのデータをｊａｖａｓｃｒｉｐｔコードへと変換するためのプロセッサとを備える。【０００６】
好ましくは、モバイル端末はディスプレイをさらに備える。プロセッサは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいてディスプレイにＳＨＡＰＥを表示させる。【０００７】
好ましくは、モバイル端末は、ＦＬＡＳＨデータを受信するための通信インターフェイスをさらに備える。メモリは、ＦＬＡＳＨデータとＨＴＭＬデータとの第２の対応関係を記憶する。プロセッサは、同一のＳＨＡＰＥを表すデータを認識可能なように、受信したＦＬＡＳＨデータを第２の対応関係に従ってＳＨＡＰＥを表すベクターシェイプフォーマットのデータを含むＨＴＭＬデータへと変換する。【０００８】
この発明の別の局面に従うと、ベクターシェイプフォーマットおよびｊａｖａｓｃｒｉｐｔに対応したモバイル端末のプロセッサに、ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを取得するステップと、予め定められた第１の対応関係に従って初出のＳＨＡＰＥのベクターシェイプフォーマットのデータに基づいて対応するｊａｖａｓｃｒｉｐｔ関数を定義するステップと、既出のＳＨＡＰＥのベクターシェイプフォーマットのデータをｊａｖａｓｃｒｉｐｔコードへと変換するステップとを実行させる、変換プログラムが提供される。【０００９】
好ましくは、プログラムは、モバイル端末に、変換後のｊａｖａｓｃｒｉｐｔコードに基づいてディスプレイにＳＨＡＰＥを表示させるステップを実行させる。【００１０】
好ましくは、プログラムは、モバイル端末に、ＦＬＡＳＨデータを受信するステップと、同一のＳＨＡＰＥを表すデータを認識可能なように、受信したＦＬＡＳＨデータを予め定められた第２の対応関係に従ってＳＨＡＰＥを表すベクターシェイプフォーマットのデータを含むＨＴＭＬデータへと変換するステップとをさらに実行させる。【００１１】
この発明の別の局面に従うと、ベクターシェイプフォーマットおよびｊａｖａｓｃｒｉｐｔに対応したモバイル端末によって実現される変換方法が提供される。変換方法は、ＳＨＡＰＥを表すベクターシェイプフォーマットのデータを取得するステップと、予め定められた第１の対応関係に従って初出のＳＨＡＰＥのベクターシェイプフォーマットのデータに基づいて対応するｊａｖａｓｃｒｉｐｔ関数を定義するステップと、既出のＳＨＡＰＥのベクターシェイプフォーマットのデータをｊａｖａｓｃｒｉｐｔコードへと変換するステップとを備える。【００１２】
好ましくは、変換方法は、変換後のｊａｖａｓｃｒｉｐｔコードに基づいてディスプレイにＳＨＡＰＥを表示させるステップをさらに備える。【００１３】
好ましくは、変換方法は、ＦＬＡＳＨデータを受信するステップと、同一のＳＨＡＰＥを表すデータを認識可能なように、受信したＦＬＡＳＨデータを予め定められた第２の対応関係に従ってＳＨＡＰＥを表すベクターシェイプフォーマットのデータを含むＨＴＭＬデータへと変換するステップとをさらに備える。
【発明の効果】
【００１４】
以上のように、本発明によって、モバイル端末における、ＳＷＦデータを自身が解釈可能なデータに変換して表示する速度を向上させることが可能になる。
【図面の簡単な説明】
【００１５】
【図１】本実施の形態に係るスマートフォン１００のハードウェア構成を表わすブロック図である。
【図２】本実施の形態に係る変換処理の動作概要を示すフローチャートである。
【図３】本実施の形態に係る変換処理の動作概要を示すイメージ図である。
【図４】本実施の形態に係るｊａｖａｓｃｒｉｐｔ関数のマーカとパラメータと説明とを示すイメージ図である。
【図５】本実施の形態に係るＳＨＡＰＥを表すＨＴＭＬ５データからｊａｖａｓｃｒｉｐｔ関数への変換処理を示すイメージ図である。
【図６】本実施の形態に係る複数のＳＨＡＰＥを表すＨＴＭＬ５データから複数のｊａｖａｓｃｒｉｐｔ関数への変換処理を示すイメージ図である。
【図７】本実施の形態に係るＳＨＡＰＥを表すＨＴＭＬ５データからｊａｖａｓｃｒｉｐｔ関数への変換処理（ステップＳ１２１）を示すフローチャートである。
【図８】第１のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図９】第２のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図１０】第３のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図１１】第４のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図１２】第５のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図１３】第６のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図１４】第７のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図１５】第８のＳＨＡＰＥとそのソースコードとを示すイメージ図である。
【図１６】本実施の形態に係るｊａｖａｓｃｒｉｐｔ関数の定義後のＳＨＡＰＥ描画処理を示すイメージ図である。
【図１７】本実施の形態に係るｊａｖａｓｃｒｉｐｔコードへの変換後のＳＨＡＰＥ描画処理を示すフローチャートである。
【図１８】具体例における、最終的にタッチパネル１３０に表示されるＳＨＡＰＥを示すイメージ図である。
【図１９】具体例における、入力データのソースコードの一例である。
【図２０】具体例における、ｊａｖａｓｃｒｉｐｔ関数を作成（定義）するためのソースコードの一例である。
【図２１】具体例における、作成（定義）されたｊａｖａｓｃｒｉｐｔ関数のソースコードの一例である。
【図２２】一般的な変換および表示処理を示すフローチャートである。
【図２３】一般的な変換および表示処理のソースコードの一例を示す。
【図２４】一般的な変換および表示処理を示すイメージ図である。
【図２５】本実施の形態における変換および表示処理の一部を示すイメージ図である。
【図２６】本実施の形態の変換および表示処理と一般的な変換および表示処理とを示すイメージ図である。
【図２７】既出のＳＨＡＰＥデータに関する、本実施の形態の変換および表示処理と一般的な変換および表示処理とのステップの違いを示すイメージ図である。
【符号の説明】
【００１６】
１００  スマートフォン
１１０  ＣＰＵ
１２０  メモリ
１２１  ＳＷＦデータ
１２２  ＳＨＡＰＥを表すＣＡＮＶＡＳデータ
１２３  ｊａｖａｓｃｒｉｐｔコード
１２４  ｊａｖａｓｃｒｉｐｔ関数
１３０  タッチパネル
１４０  スピーカ
１５０  マイク
１６０  通信インターフェイス
１７０  ボタン
【発明を実施するための形態】
【００１７】
以下、図面を参照しつつ、本発明の実施の形態について説明する。以下の説明では、同一の部品には同一の符号を付してある。それらの名称および機能も同じである。したがって、それらについての詳細な説明は繰り返さない。
【００１８】
以下では、スマートフォン１００を「モバイル端末」の代表例として説明を行う。ただし、「モバイル端末」は、その他の携帯電話、電子手帳、電子ブック、ノート型パーソナルコンピュータなどのような、ディスプレイを有する他の情報端末によっても実現可能である。
【００１９】
＜スマートフォン１００のハードウェア構成＞
次に、スマートフォン１００のハードウェア構成について説明する。図１は、本実施の形態に係るスマートフォン１００のハードウェア構成を表わすブロック図である。
【００２０】
図１を参照して、スマートフォン１００は、主たる構成要素として、ＣＰＵ１１０と、メモリ１２０と、タッチパネル１３０と、スピーカ１４０、マイク１５０、通信インターフェイス１６０と、ボタン１７０とを含む。
【００２１】
メモリ１２０は、各種のＲＡＭ（Random  Access  Memory）や、ＲＯＭ（Read-Only  Memory）や、ハードディスクなどによって実現される。メモリ１２０は、ＣＰＵ１１０によって実行される制御プログラムを記憶する。メモリ１２０は、動画像または静止画像を表示するためのＳＷＦデータ、ＨＴＭＬデータなどを記憶する。また、メモリ１２０は、ベクターシェイプフォーマットとｊａｖａｓｃｒｉｐｔコードとの対応関係を示すデータ１２７を格納する。また、メモリ１２０は、ＦＬＡＳＨデータとＨＴＭＬデータ（たとえばＣＡＮＶＡＳデータなど）との対応関係を示すデータ１２８を格納する。
【００２２】
タッチパネル１３０は、ディスプレイとポインティングデバイスとを含む。タッチパネル１３０は、抵抗膜方式、表面弾性波方式、赤外線方式、電磁誘導方式、静電容量方式などのいずれのタイプであってもよい。タッチパネル１３０は、光センサ液晶を含んでもよい。
【００２３】
タッチパネル１３０は、ＣＰＵ１１０からの命令（信号）に基づいて、文字や画像を表示する。ＣＰＵ１１０は、各種のデータに基づいて、タッチパネル１３０に文字や画像をを表示させる。たとえば、ＣＰＵ１１０は、制御プログラムに基づいてタッチパネル１３０に各種のソフトウェアボタンを表示させたり、ＨＴＭＬデータまたはｊａｖａｓｃｒｉｐｔコードに基づいて、動画像または静止画像を表示させる。
【００２４】
タッチパネル１３０は、所定時間毎に外部の物体によるタッチパネル１３０へのタッチ操作を検知して、タッチ座標（接触座標）をＣＰＵ１１０に入力する。換言すれば、ＣＰＵ１１０は、タッチパネル１３０から順次タッチ座標を取得する。ＣＰＵ１１０は、タッチ座標に基づいて、ユーザからの命令の入力を受け付ける。
【００２５】
スピーカ１４０は、ＣＰＵ１１０からの信号に基づいて、音声を出力する。すなわち、ＣＰＵ１１０は、受信した音声データまたは変換された音声データに基づいて、スピーカ１４０に音声を出力させる。
【００２６】
マイク１５０は、音声を受け付けて、音声信号をＣＰＵ１１０に入力する。ＣＰＵ１１０は、マイク１５０から音声信号に基づいて、通信インターフェイス１６０などを介して、他の電話などに音声信号を送信する。
【００２７】
通信インターフェイス１６０は、アンテナやコネクタによって実現される。通信インターフェイス１６０は、有線通信あるいは無線通信によって他の装置との間でデータをやり取りする。換言すれば、ＣＰＵ１１０は、通信インターフェイス１６０を介して、他の装置からプログラムや画像データやテキストデータなどを受信したり、他の装置に画像データやテキストデータを送信したりする。
【００２８】
ボタン１７０は、スマートフォン１００の表面に配置される。スマートフォン１００には、電源キー、ホームキー、文字キー、テンキー、十字キー、決定キーなどの複数のボタンが配置されても良い。ボタン１７０は、ユーザから命令を受け付ける。ボタン１７０は、ユーザからの命令をＣＰＵ１１０に入力する。
【００２９】
ＣＰＵ１１０は、メモリ１２０に記憶されている制御プログラムを実行することによって、スマートフォン１００の各部を制御する。すなわち、ＣＰＵ１１０は、メモリ１２０に記憶されている制御プログラムを実行することによって、以下に記載の各種の処理を実行する。
【００３０】
＜動作概要＞
以下では、スマートフォン１００のＣＰＵ１１０によって実行される変換処理について説明する。図２は、本実施の形態に係る変換処理の動作概要を示すフローチャートである。図３は、本実施の形態に係る変換処理の動作概要を示すイメージ図である。
【００３１】
図２および図３を参照して、ＣＰＵ１１０は、通信インターフェイス１６０を介して、ＳＷＦデータ１２１を受信する（ステップＳ１０２）。
【００３２】
ＣＰＵ１１０は、ＳＷＦデータ１２１をメモリ１２０に展開して、ＦＬＡＳＨ構造体毎にＨＴＭＬ５構造体に変換する（ステップＳ１１０）。たとえば、ＣＰＵ１１０は、ＦＬＡＳＨ構造体のＳＨＡＰＥを表すデータを、ＨＴＭＬ５のＣＡＮＶＡＳデータ１２２へと変換する（ステップＳ１１１）。より詳細には、ＣＰＵ１１０は、ＳＷＦデータ１２１に基づいて、同じＳＨＡＰＥを示すデータが識別できるように、ＨＴＭＬ５データに含まれるＳＨＡＰＥを表すＣＡＢＶＡＳデータ１２２内にＳＨＡＰＥ毎の識別番号を格納する。ＣＰＵ１１０は、他のＦＬＡＳＨ構造体のデータも、ＨＴＭＬ５データへと変換する。
【００３３】
なお、本実施の形態においては、ＣＰＵ１１０は、変換後のＨＴＭＬ５データを解釈してタッチパネル１３０に動画像および静止画像を表示するための、Ｗｅｂブラウザ上で実行されるエンジンプログラムも作成する。
【００３４】
ＣＰＵ１１０は、ＳＨＡＰＥを表すＨＴＭＬ５のＣＡＮＶＡＳデータ１２２をｊａｖａｓｃｒｉｐｔコード１２３へと変換する（ステップＳ１２０）。具体的には、ＣＰＵ１１０は、ＳＨＡＰＥの識別番号に基づいて、ＨＴＭＬ５データの中の初出のＳＨＡＰＥのＣＡＮＶＡＳデータ１２２に基づいて、ｊａｖａｓｃｒｉｐｔ関数１２４を定義する（ステップＳ１２１）。これによって、ＳＨＡＰＥ毎のｊａｖａｓｃｒｉｐｔ関数１２４が、ＣＰＵ１１０によってすぐに利用できるように、メモリ１２０に記憶される。ＣＰＵ１１０は、ＳＨＡＰＥの識別番号に基づいて、ＨＴＭＬ５データの中のＳＨＡＰＥのＣＡＮＶＡＳデータ１２２（初出および既出のＳＨＡＰＥのデータを含む。）を、ｊａｖａｓｃｒｉｐｔコード１２３に変換する（ステップＳ１２１）。
【００３５】
ＣＰＵ１１０は、作成されたエンジンプログラムを実行することによって、ＨＴＭＬ５データおよびｊａｖａｓｃｒｉｐｔコードに基づいて、タッチパネル１３０に動画像や静止画像を表示させる（ステップＳ１３０）。
【００３６】
このように、通常のベクターシェイプフォーマットをｊａｖａｓｃｒｉｐｔコードへと変換することによって、動画像や静止画像を表示する際における構造化データの解析の処理速度が早まるとともに、表示されるＳＨＡＰＥも美しいものとなる。
【００３７】
具体的には、ｊａｖａｓｃｒｉｐｔコードの定義および変換を利用するメリットは、一度だけｊａｖａｓｃｒｉｐｔ関数を作成（定義）すれば、その後は、マーカ毎に対応するｊａｖａｓｃｒｉｐｔコードを選択することなく、同様のＳＨＡＰＥを示すデータを当該ｊａｖａｓｃｒｉｐｔコードへと変換することができるようになる。その結果、同じものであるにもかかわらずＳＨＡＰＥを描画する度にマーク毎に対応するｊａｖａｓｃｒｉｐｔコードを探す必要がなくなり、ＳＨＡＰＥの描画処理にかかる時間を短縮することが可能になる。
【００３８】
以下、このような機能を実現するための技術について詳述する。
＜ｊａｖａｓｃｒｉｐｔ関数の作成処理の具体例＞
【００３９】
本実施の形態にかかるｊａｖａｓｃｒｉｐｔ関数の作成メソッドは、形状を描画する手順を記述するデータを構造化し、その構造データを使って形状を再構成してＨＴＭＬのＣＡＮＶＡＳエレメントに線を描画する場合に適用される。形状データに対する効率的スペース（ローメモリ）要件のような構造化データが持つ利点と、形状を描画するｊａｖａｓｃｒｉｐｔコードの実行速度の高速化を組み合わせるということを目的とする。
【００４０】
一般的には、形状データ構造に含まれるデータから形状を描画するには、構造を汎用描画関数に渡す。通常、汎用描画関数は、形状データ構造のエレメントを繰り返し、要求された描画オペレーションを実行する。
【００４１】
等価なｊａｖａｓｃｒｉｐｔのＣＡＮＶＡＳ描画コマンド群が生成されれば、要求された形状を描画するためのｊａｖａｓｃｒｉｐｔ関数を作ることができる。この関数には、いくつかの利点がある。すなわち、要求に応じて必要なときに生成することが可能なこと、ｊａｖａｓｃｒｉｐｔ実行エンジンによって、より効率的にコードを最適化できる可能性があること、汎用描画関数からの繰り返しステップや分岐ステップがなくなるためより高速に処理を行えるということ、などが挙げられる。
【００４２】
以降で、形状描画用ランタイムｊａｖａｓｃｒｉｐｔコードを生成するプロセスを説明する。事前に生成されたランタイムｊａｖａｓｃｒｉｐｔコードは、構造化データのランタイム構文解析よりも最適化に優れ、総合的な速度および形状描画パフォーマンスに優れている。このパフォーマンス向上は、構造化データのランタイムでの構文解析よりも高速で実行できる事前に生成されたｊａｖａｓｃｒｉｐｔ関数を呼び出すことで可能となる。
【００４３】
また、形状描画用のｊａｖａｓｃｒｉｐｔコードを生成する目的は、ランタイム実行時に、エンジンが形状を描画するための最適なアプローチを構成することにある。生成済みの関数を呼び出して事前生成ｊａｖａｓｃｒｉｐｔコードを実行することで、データのランタイム構文解析や、形状描画時にランタイムでデータアレイやオブジェクトを反復するよりも高速で実行できる。
【００４４】
ｊａｖａｓｃｒｉｐｔコードを生成するには、生成関数（generator
function）に渡すために特定のデータ構造であることが要求される。データ構造は、次のようなオブジェクトとプロパティの集合から構成されている。
・形状内部のパス（path）群
・形状における各ポイントの位置
・線のスタートポイントとエンドポイント
・キャンバスコンテクストの移動
・線のタイプ（直線または曲線）
・形状に対するフィル（fill）のタイプ
ストローク
単一色のフィル
直線勾配または放射状勾配のフィル
イメージパターンの繰り返しまたは繰り返し無しのフィル
クリッピングマスク
・領域クリッピングの適用の有無
・その他
【００４５】
各形状に対するｊａｖａｓｃｒｉｐｔコードは、関数の形で生成される。こうした関数を、エンジンはランタイム実行時に何回でも呼び出して、ＣＡＮＶＡＳ上に形状を描画することができる。以下では、プロセスの流れを表す簡単な例を示す。
【００４６】
次に、ｊａｖａｓｃｒｉｐｔ関数の作成処理の具体例について説明する。図４は、本実施の形態に係るｊａｖａｓｃｒｉｐｔ関数のマーカとパラメータと説明とを示すイメージ図である。図５は、本実施の形態に係るＳＨＡＰＥを表すＨＴＭＬ５データからｊａｖａｓｃｒｉｐｔ関数への変換処理を示すイメージ図である。図６は、本実施の形態に係る複数のＳＨＡＰＥを表すＨＴＭＬ５データから複数のｊａｖａｓｃｒｉｐｔ関数への変換処理を示すイメージ図である。図７は、本実施の形態に係るＳＨＡＰＥを表すＨＴＭＬ５データからｊａｖａｓｃｒｉｐｔ関数への変換処理（ステップＳ１２１）を示すフローチャートである。
【００４７】
図４から図７（および図２０）を参照して、ＣＰＵ１１０は、入力されたＨＴＭＬ５データのうちのＳＨＡＰＥを表すデータ（たとえば、ＣＡＮＶＡＳデータなど）毎に、ｊａｖａｓｃｒｉｐｔ関数を宣言する（ステップＳ１２２）。すなわち、ＣＰＵ１１０は、関数のアウトラインを作成する。生成されたｊａｖａｓｃｒｉｐｔ関数は、ＳＨＡＰＥ毎にユニークな識別情報を有する。これによって、ＣＰＵ１１０は、生成されたｊａｖａｓｃｒｉｐｔ関数をすぐに呼び出すことが可能になる。
【００４８】
具体的には、ＣＰＵ１１０は、特定のベクターシェイプフォーマットを有するＳＨＡＰＥデータを受け取る。たとえば、ＳＨＡＰＥデータは、形の内のパスであるか否かを示す情報と、形の中の各ポイントの位置を示す情報と、ラインのスタートおよびエンド・ポイントの位置を示す情報と、ＣＡＮＶＡＳ・コンテキストの動きを示す情報と、ライン(直線か曲線か)のタイプを示す情報と、塗りの種類を示す情報と、線形または放射状の勾配を示す情報と、イメージパターンの繰り返すを示す情報と、マスクを切り取ることを示す情報などが含まれる。
【００４９】
関数の宣言がされた後、ＣＰＵ１１０は、ＳＨＡＰＥを示す各データに基づいて、ｊａｖａｓｃｒｉｐｔコードをｊａｖａｓｃｒｉｐｔ関数に追加することを繰り返す。具体的には、ＣＰＵ１１０は、入力データからマークを抽出する（ステップＳ１２３）。
【００５０】
ＣＰＵ１１０は、マーク毎に、パラメータを必要とするか否かを判断する（ステップＳ１２４）。パラメータを必要としない場合（ステップＳ１２４にてＮＯである場合）、ＣＰＵ１１０は、ステップＳ１２６からの処理を実行する。パラメータを必要とする場合（ステップＳ１２４にてＹＥＳである場合）、入力されたデータからパラメータを抽出する（ステップＳ１２５）。
【００５１】
ＣＰＵ１１０は、マーク毎に、対応するｊａｖａｓｃｒｉｐｔコードを特定し、ｊａｖａｓｃｒｉｐｔ関数に追加する（ステップＳ１２６）。ＣＰＵ１１０は、入力データに他のマークが含まれているか否かを判断する（ステップＳ１２８）。ＣＰＵ１１０は、入力データに他のマークが含まれている場合（ステップＳ１２７にてＹＥＳである場合）、ステップＳ１２３からの処理を繰り返す。ＣＰＵ１１０は、入力データに他のマークが含まれていない場合（ステップＳ１２７にてＮＯである場合）、次のＳＨＡＰＥに関するデータの変換処理へ進む。
【００５２】
＜ｊａｖａｓｃｒｉｐｔ関数に利用されるｊａｖａｓｃｒｉｐｔコードの具体例＞
次に、ｊａｖａｓｃｒｉｐｔ関数に利用されるｊａｖａｓｃｒｉｐｔコードの具体例について説明する。
【００５３】
たとえば、ＣＡＮＶＡＳコンテクストが既に存在しているものとして、生成コードはＣＡＮＶＡＳコンテクストに関する全てのアクションを実行する。本ドキュメントの例では、コンテクストは「ctx」として参照され、以下のようなコードによって生成される。
var canvas =
document.createElement('canvas');
var ctx = canvas.getContext('2d');
【００５４】
コードの生成は、関数宣言を作成して関数のアウトラインを構成することから開始される。生成された各関数には、固有のＩＤが適切に割り当てられる。このように、各形状には、必要なときにいつでも容易に呼び出せる、正確に形状に対応した1つの関数が存在する。
【００５５】
関数宣言のためのコードが生成された後、形状データによる繰り返しが始まりる。データから読み込まれたパラメータに従って、適切なｊａｖａｓｃｒｉｐｔコードブロックが生成コードに挿入される。データに従って、生成関数（generator function）は、新たなパス（path）を作し、既にスタートしたパスを閉じ、勾配（gradient）を作り、クリッピング（clip）、フィル（fill）、ストローク（stroke）、保存（save）、リストア（restore）または変換（transform）を適用する、直線（line）または二次曲線（quadratic curve）を描画する、あるいはこれら以外の適切なアクションを実行する等、実行する適切なアクションを決定する。
【００５６】
形状内にある全てのパスは、次のコードから始まる。
ctx.beginPath();
【００５７】
fillを伴わない線ストロークだけが必要な場合、あらかじめパスを閉じなくても実行可能であるが、fillが必要な場合には、ＣＰＵ１１０は、fill()コマンドを適用する前にパスを閉じる。開いているパスを閉じるためのソースコードは、次のようになる。
ctx.closePath();
【００５８】
パス（path）とは、独自のフィル（fill）、線（line）、色（color）、変換プロパティ（transformation property）を持つことのできる形状の内部に、部分的な輪郭を描く線のシーケンスである。ClosePathとは、エンドポイントをスタートポイントにつなげるという意味である。これにより、完全にパスは閉じられ、必要に応じてフィルを実行できるようになる。
【００５９】
パスがスタートした後、ソースコード行のシーケンスが生成される。このシーケンスは、入力データで定義されたとおりの正確なパスを生成する必要に応じて、キャンバスコンテクスト（canvas context）の移動や線の描画を実行するために用いられる。
【００６０】
線（lines）は、直線または曲線でありうる。直線（straight lines）は、現在のコンテクストポイント位置とエンドポイントのx、y座標とを結んで描かれる。曲線（curved lines）は、コンテクストポイント、コントロールポイントおよびエンドポイントによって定義される二次曲線として描かれる。二次曲線は、現在のコンテクストポイント位置とエンドポイントのx、y座標を結んで描かれますが、線の曲率を計算するためにコントロールポイントのx、y座標も使われる。この曲率計算は、html5キャンバス内部で実行される。
【００６１】
入力データ中でmoveマーカに遭遇すると、x、y座標が入力データから読み込まれ、ｊａｖａｓｃｒｉｐｔコードが生成されたソースコードに追加される。これにより、コンテクストポインタが適切なx、y座標に設定されるように、キャンバスコンテクストの移動が実行される。
【００６２】
以下は、キャンバスコンテクストをx、y座標（100、100）に移動させるための生成コードの例である。
ctx.moveTo(100,100);
【００６３】
ＣＰＵ１１０は、straight lineマーカに遭遇すると、直線のエンドポイント座標（x、y）が入力データ構造から読み込まれ、Ｊａｖａｓｃｒｉｐｔコードが生成され、生成コードに追加される。これにより、現在コンテクストのポイント位置とエンドポイント座標（x、y）を結ぶ線が、キャンバス上に描画される。
【００６４】
図８は、第１のＳＨＡＰＥとそのソースコードとを示すイメージ図である。図８を参照して、現在コンテクストのポインタ位置とx、y座標（200、100）を結ぶ直線を、キャンバス上に描くための生成コードの例である。
ctx.lineTo(200, 100);
上記イメージは、直線の例です
【００６５】
図９は、第２のＳＨＡＰＥとそのソースコードとを示すイメージ図である。図９を参照して、ＣＰＵ１１０は、curved lineマーカに遭遇すると、コントロールポイントを表すx、y座標と線のエンドポイントを表すx、y座標が入力データ構造から読み込まれ、現在コンテクストのポイント位置（P0）とエンドポイント（P2）のx、y座標を結ぶ二次曲線を、座標x、yを持つコントロールポイント（P1）を用いてキャンバス上に描画するためのＪａｖａｓｃｒｉｐｔコードが追加される。たとえば、図９は、現在コンテクストのポインタ位置とx、y座標（200、200）を結ぶ曲線を、x、y座標（100、0）持つコントロールポイントを用いてキャンバス上に描画するための生成コードを示す。
【００６６】
図１０は、第３のＳＨＡＰＥとそのソースコードとを示すイメージ図である。図１０を参照して、パスが閉じられると、パスで輪郭が描かれた領域にフィル（fill）を適用することができる。フィル（fill）は、領域を、単一色、勾配またはパターンでフィル（充填）することで実行される。用いられるフィルのタイプは、入力データ中に記述されている。図１０は、正方形をフィルする描画コードの例である。
【００６７】
図１１は、第４のＳＨＡＰＥとそのソースコードとを示すイメージ図である。図１１を参照して、ストローク（Stroke）は、入力データに記述されている色と線幅で、実際にキャンバス上で線を目に見えるようにすることで実行される。
【００６８】
図１２は、第５のＳＨＡＰＥとそのソースコードとを示すイメージ図である。図１２を参照して、ＣＰＵ１１０は、solid color setupマーカに遭遇すると、赤、緑、青の色値とアルファ値が入力データから読み込まれ、キャンバスをフィルするスタイルを目的の色値に設定するためのＪａｖａｓｃｒｉｐｔコードが生成される。
【００６９】
図１３は、第６のＳＨＡＰＥとそのソースコードとを示すイメージ図である。ＣＰＵ１１０は、透明色の塗りを示すマーカを抽出した場合、図１３のようなソースコードを作成する。
【００７０】
図１４は、第７のＳＨＡＰＥとそのソースコードとを示すイメージ図である。図１４を参照して、ＣＰＵ１１０は、linear gradientマーカに遭遇すると、新たな直線勾配（linear
gradient）を作るためのコードが追加される。その後、入力データから色シーケンスが読み込まれ、各色の終点で適切なＪａｖａｓｃｒｉｐｔコードが生成され、生成コードに追加される。直線勾配（linear gradient）は、勾配の方向を定義する架空の直線によって定義される。この方向を生成コード中に設定するには、入力データから変換マトリックス（transformation matrix）を読み込み、勾配のフィルが適用される前にこの変換マトリックスをキャンバスコンテクストに適用するコードを追加する。
【００７１】
図１５は、第８のＳＨＡＰＥとそのソースコードとを示すイメージ図である。図１５を参照して、ＣＰＵ１１０は、radial gradientマーカに遭遇すると、新たな放射状勾配（radial
gradient）を作るためのコードが追加される。その後、色シーケンスが入力データから読み込まれ、各色の終点で適切なＪａｖａｓｃｒｉｐｔコードが生成され、生成コードに追加される。
【００７２】
放射状勾配（radial gradient）は、勾配の方向を定義する2つの架空の円（スタート円とエンド円）によって定義される。この方向を生成コードに設定するには、入力データから変換マトリックス（transformation matrix）を読み込み、勾配フィルが適用される前にこの変換マトリックスをキャンバスコンテクストに適用するコードを追加する。
【００７３】
ＣＰＵ１１０は、pattern fillマーカに遭遇すると、ソースイメージ、繰り返しフラグまたは繰り返し無しフラグ、変換マトリックスが入力データから読み込まれ、パスのフィルに用いられるパターンを作り出すＪａｖａｓｃｒｉｐｔコードが生成される。
以下は、イメージパターンのフィルを繰り返すためのコードの例である。
ctx.createPattern(img,
"repeat");
以下は、イメージパターンのフィルを繰り返さないコードの例である。
ctx.createPattern(img,
"no-repeat");
ＣＰＵ１１０は、clipマーカに遭遇すると、コンテクストをクリッピングするためのコードが生成され、生成Ｊａｖａｓｃｒｉｐｔコードに追加される。以下は、コンテクストをクリッピングするための線の例である。
ctx.clip();
【００７４】
結論として、本実施の形態のプロセスにより、リアルタイムのランタイム形状描画に向けた、より効率的で最適化されたパフォーマンスのためのアプローチが達成された。事前に生成されたデータ構造を転送することにより、さらに追加のデータを転送するという不必要なオーバーヘッドは避けられる。転送する必要があると考えられるデータの例には、種々のキャンバスコンテクスト、オブジェクトおよび付随するメソッドとプロパティ等がありえる。
【００７５】
この種のデータ構造転送のさらなる利点としては、全体プロセスフローの単純化がありえる。事前生成Ｊａｖａｓｃｒｉｐｔランタイムコードの利点は、コードがたった一回で生成され、必要なコンテクストにおいて、すばやく形状を描画するために何回でもコードをランタイムで呼び出すことが可能なことである。これにより、形状を描画するために、ランタイム実行時に毎回データを構文解析しなければならない場合と比較して、パフォーマンスは大幅に改善される。
【００７６】
＜ｊａｖａｓｃｒｉｐｔ関数の定義後のＳＨＡＰＥ描画処理＞
次に、ｊａｖａｓｃｒｉｐｔ関数の定義後（ｊａｖａｓｃｒｉｐｔコードへの変換後）のＳＨＡＰＥ描画処理について説明する。
【００７７】
前述したように、ＣＰＵ１１０は、特定のベクターシェイプフォーマットのＳＨＡＰＥデータが入力された際に、ＳＨＡＰＥ毎に、初出のＳＨＡＰＥデータに基づいてｊａｖａｓｃｒｉｐｔ関数を定義し、既出のＳＨＡＰＥデータをｊａｖａｓｃｒｉｐｔコードに変換する。そのため、既出のＳＨＡＰＥデータに関しては、ＣＰＵ１１０は、ＳＨＡＰＥデータを、マーカ毎に、ｊａｖａｓｃｒｉｐｔコードへ変換する必要がない。
【００７８】
図１６は、本実施の形態に係るｊａｖａｓｃｒｉｐｔ関数の定義後のＳＨＡＰＥ描画処理を示すイメージ図である。図１６を参照して、ＣＰＵ１１０は、ＳＨＡＰＥを特定するための識別情報に基づいて、ｊａｖａｓｃｒｉｐｔ関数が定義されているＳＨＡＰＥデータを、対応するｊａｖａｓｃｒｉｐｔコードへと直接変換し、当該ｊａｖａｓｃｒｉｐｔコードに基づいてＳＨＡＰＥを表示することができる。
【００７９】
図１７は、本実施の形態に係るｊａｖａｓｃｒｉｐｔコードへの変換後のＳＨＡＰＥ描画処理を示すフローチャートである。図１７を参照して、ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、パスの描画を開始する（ステップＳ１３１）。
【００８０】
ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、コンテキスト位置を座標（１０，５０）へ移動させる（ステップＳ１３２）。ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、座標（１０，９０）へ直線を描画する（ステップＳ１３３）。ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、座標（９０，９０）へ直線を描画する（ステップＳ１３４）。ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、座標（９０，５０）へ直線を描画する（ステップＳ１３５）。
【００８１】
ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、制御座標（５０，８０）と終点座標（１０，５０）とに基づいて曲線を描画する（ステップＳ１３６）。ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、パスの描画を終了する（ステップＳ１３７）。ＣＰＵ１１０のｊａｖａｓｃｒｉｐｔエンジンは、変換後のｊａｖａｓｃｒｉｐｔコードに基づいて、パスの内部の閉空間にＲＧＢ値（２０，６０，２５５）の色を塗る（ステップＳ１３８）。ＣＰＵ１１０は、輝線幅を有するパス上のラインを描画する（ステップＳ１３９）。
【００８２】
＜ソースコードの具体例＞
次に、本実施の形態に係る入力データのソースコードの一例と、ｊａｖａｓｃｒｉｐｔ関数を作成（定義）するためのソースコードの一例と、生成されたｊａｖａｓｃｒｉｐｔ関数のソースコードの一例とを説明する。図１８は、本具体例における、最終的にタッチパネル１３０に表示されるＳＨＡＰＥを示すイメージ図である。図１９は、本具体例における、入力データのソースコードの一例である。図２０は、本具体例における、ｊａｖａｓｃｒｉｐｔ関数を作成（定義）するためのソースコードの一例である。図２１は、本具体例における、作成（定義）されたｊａｖａｓｃｒｉｐｔ関数のソースコードの一例である。
【００８３】
すなわち、図１８に示すＳＨＡＰＥを表示するために、ＣＰＵ１１０は、図１９に示す入力データを受け付ける。ここで、「bp」、「m」、「l」、「q」、「cp」、「ss」、「s」、「fs」、「f」は実行すべきアクションを特定するためのマーカ識別子である。
【００８４】
パラメータが必要である場合、マーカに連続してパラメータが入力される。たとえば、基準位置を移動させるためのマーカー「m」は２つのパラメーターを要求する。ただし、これらのルールは、実際の利用態様に合わせて、修正したり拡張したりすることができる。
【００８５】
ＣＰＵ１１０は、図２０に示すソースコードに従って、入力データからｊａｖａｓｃｒｉｐｔ関数を定義する。具体的には、図７および図２０を参照して、ＣＰＵ１１０は、ｊａｖａｓｃｒｉｐｔ関数を宣言する。ＣＰＵ１１０が、入力データから所定のマークを抽出し、マークを対応するｊａｖａｓｃｒｉｐｔコードへと変換する。ＣＰＵ１１０は、変換後のｊａｖａｓｃｒｉｐｔコードをｊａｖａｓｃｒｉｐｔ関数に追加する。このようにして、ＣＰＵ１１０は、図２１に示すような、関数宣言を含むｊａｖａｓｃｒｉｐｔ関数を作成してメモリ１２０に格納する。
【００８６】
＜一般的な変換処理＞
ここで、一般的な変換および表示処理、すなわち、上記の実施の形態よりも変換および表示処理に時間がかかるもの、について説明する。図２２は、一般的な変換および表示処理を示すフローチャートである。図２３は、一般的な変換および表示処理のソースコードの一例を示す。
【００８７】
図２２および図２３を参照して、ＣＰＵ１１０は、入力データを読み込む（ステップＳ１３０１）。ＣＰＵ１１０は、マークを抽出し、当該マークが「Ｂｅｇｉｎ」に相当するか否かを判断する（ステップＳ１３１１）。ＣＰＵ１１０は、当該マークが「Ｂｅｇｉｎ」に相当する場合（ステップＳ１３１１にてＹＥＳである場合）、ＳＨＡＰＥの描画を開始する（ステップＳ１３１２）。
【００８８】
ＣＰＵ１１０は、当該マークが「Ｂｅｇｉｎ」に相当しない場合（ステップＳ１３１１にてＮＯである場合）、当該マークが「Ｍｏｖｅ  ｔｏ」に相当するか否かを判断する（ステップＳ１３２１）。ＣＰＵ１１０は、当該マークが「Ｍｏｖｅ  ｔｏ」に相当する場合（ステップＳ１３２１にてＹＥＳである場合）、当該マークに続くパラメータを抽出する（ステップＳ１３２２）。ＣＰＵ１１０は、基準位置を抽出したパラメータに対応する座標へと移動させる（ステップＳ１３２３）。
【００８９】
ＣＰＵ１１０は、当該マークが「Ｍｏｖｅ  ｔｏ」に相当しない場合（ステップＳ１３２１にてＮＯである場合）、当該マークが「Ｌｉｎｅ  ｔｏ」に相当するか否かを判断する（ステップＳ１３３１）。ＣＰＵ１１０は、当該マークが「Ｌｉｎｅ  ｔｏ」に相当する場合（ステップＳ１３３１にてＹＥＳである場合）、当該マークに続くパラメータを抽出する（ステップＳ１３３２）。ＣＰＵ１１０は、基準位置からパラメータに対応する座標へと直線を描画する（ステップＳ１３３３）。
【００９０】
ＣＰＵ１１０は、当該マークが「Ｌｉｎｅ  ｔｏ」に相当しない場合（ステップＳ１３３１にてＮＯである場合）、当該マークが「Ｑｌｉｎｅ  ｔｏ」に相当するか否かを判断する（ステップＳ１３４１）。ＣＰＵ１１０は、当該マークが「Ｑｌｉｎｅ  ｔｏ」に相当に対応する場合（ステップＳ１３４１にてＹＥＳである場合）、当該マークに続くパラメータを抽出する（ステップＳ１３４２）。ＣＰＵ１１０は、当該パラメータに基づいて、基準位置から曲線を描画する（ステップＳ１３４３）。
【００９１】
ＣＰＵ１１０は、当該マークが「Ｑｌｉｎｅ  ｔｏ」に相当しない場合（ステップＳ１３４３にてＮＯである場合）、当該マークが「Ｅｎｄ」に相当するか否かを判断する（ステップＳ１３５０）。ＣＰＵ１１０は、当該マークが「Ｅｎｄ」に相当しない場合（ステップＳ１３５０にてＮＯである場合）、次のＳＨＡＰＥへと処理を進める。
【００９２】
ＣＰＵ１１０は、当該マークが「Ｅｎｄ」に相当する場合（ステップＳ１３５０にてＹＥＳである場合）、当該マークが「Ｓｔｒｏｋｅ  ｃｏｌｏｒ」に相当するか否かを判断する（ステップＳ１３５１）。ＣＰＵ１１０は、当該マークが「Ｓｔｒｏｋｅ  ｃｏｌｏｅ」に相当する場合（ステップＳ１３５１にてＹＥＳである場合）、ＲＧＢ値を読み出す（ステップＳ１３５２）。ＣＰＵ１１０は、ＲＧＢ値に基づいて、色を塗る（ステップＳ１３５３）。
【００９３】
ＣＰＵ１１０は、当該マークが「Ｓｔｒｏｋｅ  ｃｏｌｏｒ」に相当しない場合（ステップＳ１３５１にてＮＯである場合）、当該マークが「Ｓｔｒｏｋｅ」に相当するか否かを判断する（ステップＳ１３６１）。ＣＰＵ１１０は、当該マークが「Ｓｔｒｏｋｅ」に相当する場合（ステップＳ１３６１にてＹＥＳである場合）、ラインに色を付す（ステップＳ１３６２）。ＣＰＵ１１０は、当該マークが「Ｓｔｒｏｋｅ」に相当しない場合（１３６１にてＮＯである場合）、他のマークに関する処理を続ける。
【００９４】
図２４は、一般的な変換および表示処理を示すイメージ図である。図２４に示すように、一般的な変換および表示処理に関しては、ＣＰＵ１１０は、同一のＳＨＡＰＥを示すベクターシェイプフォーマットのデータが繰り返し入力されてくる場合であっても、入力されてくる度に、抽出したマーク毎に、図２２に示す処理を繰り返す（図２３も参照。）必要があるため、変換および表示処理に時間がかかってしまう。
【００９５】
＜上記の実施の形態の変換および表示処理と一般的な変換および表示処理との比較＞
次に、上記の実施の形態の変換および表示処理と一般的な変換および表示処理との比較について説明する。図２５は、上記の実施の形態における変換および表示処理の一部を示すイメージ図である。
【００９６】
図２５を参照して、実施の形態における変換および表示処理に関しては、初出のＳＨＡＰＥを示すベクターシェイプフォーマットのデータが入力されたときだけ、抽出したマーク毎に図２２に示す処理を繰り返す（図２０も参照）必要がある。すなわち、初出のＳＨＡＰＥデータに関してものみ、図２５のステップＳ１３１０、ステップＳ１３２０、ステップＳ１３３０、ステップＳ１３４０を実行する必要がある。
【００９７】
しかしながら、既出のＳＨＡＰＥを示すデータが入力された場合には、ＣＰＵ１１０は、ＳＨＡＰＥの識別番号に基づいて、ｊａｖａｓｃｒｉｐｔ関数を呼び出すだけでよい。すなわち、ＣＰＵ１１０は、読み出したｊａｖａｓｃｒｉｐｔコードに基づいて、図２５のステップＳ１３１、ステップＳ１３２、ステップＳ１３３、ステップＳ１３４を実行するだけでよい。
【００９８】
図２６は、上記の実施の形態の変換および表示処理と一般的な変換および表示処理とを示すイメージ図である。具体的には、図２６（Ａ）は、一般的な変換および表示処理を示すイメージ図である。図２６（Ｂ）は、上記の実施の形態の変換および表示処理を示すイメージ図である。図２７は、既出のＳＨＡＰＥデータに関する、上記の実施の形態の変換および表示処理と一般的な変換および表示処理とのステップの違いを示すイメージ図である。
【００９９】
図２６（Ａ）および図２７を参照して、一般的な変換および表示処理に関しては、既出のＳＨＡＰＥデータに関しても、マーク毎に図２２の処理を行う必要があるため、処理に時間がかかってしまう。一方、図２６（Ｂ）および図２７を参照して、上記の実施の形態の変換および表示処理に関しては、既出のＳＨＡＰＥデータに関しては、マーク毎の図２２の処理を行う必要がないため、処理時間が低減できる。
【０１００】
＜その他の応用例＞
上記の実施の形態においては、ＣＰＵ１１０が、ＨＴＭＬ５データのＳＨＡＰＥを表すＣＡＮＶＡＳデータに基づいて、ｊａｖａｓｃｒｉｐｔ関数を作成するものであった。しかしながら、変換前のデータは、ＨＴＭＬ５データのＳＨＡＰＥを表すＣＡＮＶＡＳデータに限らず、ベクターシェイプフォーマットのデータであればよい。
【０１０１】
本発明は、システム或いは装置にプログラムを供給することによって達成される場合にも適用できることはいうまでもない。そして、本発明を達成するためのソフトウェアによって表されるプログラムを格納した外部の記憶媒体（メモリ１２０）を、システム或いは装置に供給し、そのシステム或いは装置のコンピュータ（又はＣＰＵやＭＰＵ）が外部の記憶媒体（メモリ１２０）に格納されたプログラムコードを読出し実行することによっても、本発明の効果を享受することが可能となる。
【０１０２】
この場合、外部の記憶媒体（メモリ１２０）から読出されたプログラムコード自体が前述した実施の形態の機能を実現することになり、そのプログラムコードを記憶した外部の記憶媒体（メモリ１２０）は本発明を構成することになる。
【０１０３】
また、コンピュータが読出したプログラムコードを実行することにより、前述した実施の形態の機能が実現されるだけでなく、そのプログラムコードの指示に基づき、コンピュータ上で稼動しているＯＳ（オペレーティングシステム）などが実際の処理の一部または全部を行い、その処理によって前述した実施の形態の機能が実現される場合も含まれることは言うまでもない。
【０１０４】
さらに、外部の記憶媒体（メモリ１２０）から読み出されたプログラムコードが、コンピュータに挿入された機能拡張ボードやコンピュータに接続された機能拡張ユニットに備わる他の記憶媒体に書き込まれた後、そのプログラムコードの指示に基づき、その機能拡張ボードや機能拡張ユニットに備わるＣＰＵなどが実際の処理の一部または全部を行い、その処理によって前述した実施の形態の機能が実現される場合も含まれることは言うまでもない。
【０１０５】
今回開示された実施の形態はすべての点で例示であって制限的なものではないと考えられるべきである。本発明の範囲は、上記した説明ではなく、特許請求の範囲によって示され、特許請求の範囲と均等の意味および範囲内でのすべての変更が含まれることが意図される。
【図１】
2013179352.tif 000003
【図２】
2013179352.tif 000004
【図３】
2013179352.tif 000005
【図４】
2013179352.tif 000006
【図５】
2013179352.tif 000007
【図６】
2013179352.tif 000008
【図７】
2013179352.tif 000009
【図１０】
2013179352.tif 000010
【図１１】
2013179352.tif 000011
【図１６】
2013179352.tif 000012
【図１７】
2013179352.tif 000013
【図１９】
2013179352.tif 000014
【図２０】
2013179352.tif 000015
【図２１】
2013179352.tif 000016
【図２２】
2013179352.tif 000017
【図２３】
2013179352.tif 000018
【図２４】
2013179352.tif 000019
【図２５】
2013179352.tif 000020
【図２６】
2013179352.tif 000021
【図２７】
2013179352.tif 000022
【図８】
2013179352.tif 000023
【図９】
2013179352.tif 000024
【図１２】
2013179352.tif 000025
【図１３】
2013179352.tif 000026
【図１４】
2013179352.tif 000027
【図１５】
2013179352.tif 000028
【図１８】
2013179352.tif 000029
【国際調査報告】
2013179352.tif 000030
2013179352.tif 000031
2013179352.tif 000032