大学校及び設置科 中国職業能力開発大学校　情報技術科
課題実習の前提となる科目または知識、技能・技術 工場内ネットワーク、システムプログラム、図形処理、ソフトウェア設計、コンテンツ制作、Webアプリケーション
課題に取り組む推奨段階 コンテンツ制作実習およびWebアプリケーション実習終了後
課題によって養成する知識、技能・技術

課題を通して、主にWebクライアント/Webサーバプログラミングおよび連携プログラミング技術の実践力を身に付けます。
課題情報シートをダウンロードする

製作の目的と概要

　インターネット上にある描画したデータを共有するシステムでは、描画したデータは一旦、サーバに保存などを行って、そのデータに他のクライアントがアクセスしなければ、クライアント間での共有ができず、目の前で情報を更新するリアルタイムでの共有ができるものがありませんでした。そこで、今回の総合制作実習ではMozilla社製品のFirefox®のcanvasタグとJavaScriptを利用して、ブラウザ上にキャンバスと呼ばれる領域を作成し、その領域に描画します。その描画データはクライアントが操作を行わなくてもサーバと通信し、描画したデータを他人と共有して、Web上でその描画データを互いに編集し合えて、その編集をリアルタイムで確認できるWeb描画共有システムを作成することにしました。

成果

　今回、制作したシステムを利用するとブラウザ上で描画ソフトを使っているように描画することができます。また、その描画データをWeb上で共有することが可能で、自分や他のクライアント間で編集することができます。このシステムには従来のシステムにはないリアルタイムでの情報の反映を実現しており、複数のクライアントが同じキャンバスに描画していると自分以外のクライアントがキャンバスに描画しているのがリアルタイムで閲覧することができます。同様に自分の描画データも他のクライアントから閲覧することができます。自分や他のクライアントが閲覧している描画データは編集されると、リアルタイムでキャンバスに反映されます。また、外部のイメージの利用が可能です。このシステムではCGIを利用して外部のイメージをインポートすることが可能で、既存のイメージを背景として利用できます。ブラウザの描画画面を図１に示します。
Ｗｅｂ描画共有システムの制作(H19)の画像1
図１　ブラウザの描画画面
ページのトップに戻る