Dreamweaver Technique｜JAVA Script サンプル | CSS sample | JAVA Applet sample | Flash Sample
HTML4.0 reference | DynamicHTML｜XHTML | XML sample | XSLT sample | RIKO's ASP Trial
ASP ADO リファレンス | PHP関数リファレンス | MySQL関数リファレンス

Flashアンケート集計：数値表示バージョン（Flash6）

Flashを使ったアンケート集計を作ってみましょう。CGIのプログラムはできていますし、項目を選択するラジオボタンの仕組みもできていますから、データを送信する所と集計結果を表示する所を作れば、アンケート集計は実現できます。

■　Flashアンケート集計：数値表示バージョン（Flash6）

Flash側での動作は、大きく分けて４つのブロックに分けて考えることができます。

1
 main
最初にアンケートの質問を表示したり選択肢のラジオボタンを表示するところ

2

 send
送信ボタンが押された時に、データの送信処理を行うところ
3
 disp
表示ボタンが押された時に、データの受信のみを行うところ
4
 kekka
CGIからの受信が終了した時に、そのデータを表示するところ

■　作成

最初に、アンケート結果を数値で表示するバージョンを作成します。
アンケートの内容は、次のような質問にします。

質問:患者さんとのコミュニケーションにおけるコメディカルスタッフの位置づけ

選択肢
①　患者さんの緊張を緩和させる
② 　患者さんの相談に乗っている
③ 　特定の分野のみ説明している
④ 　医師と同等に説明している
⑤ 　患者さん意思を医師に伝える役をしている
⑥ 　特に役割はない
⑦ 　その他

1.　[修正]－[ドキュメント]でムービーのサイズは550×400px位にしておきます。

2.　レイヤーを５つ追加して、計6層のレイヤーを用意します。フレームは22フレームまで用意します。

ラベル名
説明
label ラベル用レイヤー
action ActionScript用レイヤー
dispkekka アンケート結果表示用レイヤー
button ボタン用レイヤー
radio ラジオボタン用レイヤー
back 背景用レイヤー

3.　「label」レイヤーで、1フレーム、6フレーム、11フレーム、16フレーム目にキーフレームを作成し、「main」「send」「disp」「kekka」というラベルを設定します。

4.　「back」レイヤーに背景の絵を描いて、静止テキストを挿入します。

5.　「radio」レイヤーにラジオボタンを表示します。先ほど作ったラジオボタンコンポーネントを利用しましょう。
　「radibottun.fla」を開き、[ウィンドウ]－[ライブラリ]メニューでライブラリを表示します。その状態で作成中のファイルを[ウィンドウ]メニューの一番下から選択すると、作成中の画面上に 「radibottun.fla」のライブラリが表示されます。

6.　その状態でライブラリからコンポーネントをドラッグ＆ドロップすると、今作成中のファイルにコンポーネントがコピーされて使えるようになります。「ezRadioGroup」を１つと「ezRadioButton」を７つドラッグ＆ドロップします。
　 「ezRadioGroup」には、「RadioGroup1」という名前をつけておきます。「kekka」フレームから後ろではラジオボタンの表示は必要ありませんので、空白キーフレームを挿入しておきます。背景の絵も追加します。

7.　ボタンシンボルを作成し、「button」レイヤーに2つ配置します。
　送信用ボタンに「send_btn」、表示用ボタンに「disp_button」というインスタンス名を付けます。「kekka」フレームから後ろではボタンの表示は必要ありませんので、空白キーフレームを挿入しておきます。

8.　「dispkekka」レイヤーの「kekka」フレームに、kekkaを表示するテキストボックスを作ります。テキストツールに「ダイナミックテキスト」のテキストボックスを1つ作り、変数名を「dispkekka」とします。「線の種類」を[複数行]に設定しておきます。

9.　「Action」レイヤーの「main」フレームに、以下のスクリプトを記述します。

1
 //-- 初期化
2
 //-- 各項目名
3
 fname = ["i-mode/携帯対応ページ", "Flash Movie作成", "産婦人科の病気のお話", "perl/ASP", "Biochemistory Simmulation ", "Virtual Hospital/その他"];
4
 maxnum = fname.length;
5
 //-- ラジオボタンの初期設定
6
 for (i = 0; i < maxnum; i++) {
7
 datanum[i] = 1 ;
8
 this["radio" + i].label = fname[i];
9
 }
10
 stop ();
11
 //-- 送信ボタン
12
 send_btn.tabIndex = 1;
13
 send_btn.onRelease = function () {
14
 gotoAndPlay ("send");
15
 };
16
 //-- 表示ボタン
17
 disp_btn.tabIndex = 2;
18
 disp_btn.onRelease = function () {
19
 gotoAndPlay ("disp");
20
 };

3行目：fnameという変数に各選択項目の表示内容を用意しています。
　　　「Arrayオブジェクト＝newArray();」は、「Arrayオブジェクト＝[];」と略して記述することできます。ここでは、「fname＝[];」と記述しています。

4行目：項目の数をmaxnumに代入しています。

6～8行目：ラジオボタンの各項目に、表示内容を表示しています。

12行目：[TAB]キーを押すとこのボタンが1番目に選択されるように設定しています。

13～15行目：この送信用ボタンが押されたら、「send」フレームにジャンプします。

17行目：[TAB]キーを押すとこのボタンが2番目に選択されるように設定しています。

18～20行目：この表示用ボタンがクリックされたら、「disp」フレームにジャンプします。

10.　「action」レイヤーの「send」フレームに、以下のスクリプトを記述します。

1
 //--アンケート送信オブジェクト
2
 mySendVars = new LoadVars();
3
 mySendVars.selectdata = RadioGroup1.getValue();
4
 //--アンケート受信オブジェクト
5
 myLoadVars = new LoadVars();
6
 myLoadVars.onLoad = function(success) {
7
 gotoAndStop("kekka");
8
 }
9
 //--アンケート送受信
10
 mySendVars.sendAndLoad("enqdata.cgi",myLoadVars,"POST");
11
 stop();

2行目：アンケート送信用のオブジェクトを作ります。

3行目：CGIに送信する「selectdata」という変数に、ラジオボタン司令塔の「Radiogroup1」の「getValue関数」で取得した、今選択されている値を代入します。

5行目：データ受信用のオブジェクトを作ります。

6～8行目：データの読み込みが完了したら、「kekka」フレームにジャンプします。

10行目：データの送受信を開始します。

11行目：データの読み込みが完了するまで、このフレームで停止します。

11.　「action」レイヤーの「disp」フレームに、以下のフレームスクリプトを記述します。

1
 //--アンケート受信オブジェクト
2
 myLoadVars = new LoadVars();
3
 myLoadVars.onLoad = function(success) {
4
 gotoAndStop("kekka");
5
 }
6
 //--アンケート受信
7
 myLoadVars.load("enqdata.cgi");
8
 stop();

2行目：データ受信用のオブジェクトを作ります。

3～5行目：データの読み込みが完了したら、「kekka」フレームにジャンプします。

7行目：データの送受信を開始します。

8行目：データの読み込みが完了するまで、このフレームで停止します。

12.　「action」レイヤーの「kekka」フレームに、以下のスクリプトを記述します。

1
 //-- 各項目の値を表示する
2
 dispkekka = "";
3
 for (i = 0; i < maxnum; i++) {
4
 dispkekka += fname[i] + ":" + myLoadVars["dat" + i] + newline;
5
 }
6
 stop ();

2行目：結果を表示するテキストの「despkekka」をクリアします。

3～5行目：すべての項目について、処理を繰り返します。
　　　　「項目名」と「アンケート結果の数値」と「改行」をdispkekkaに追加していくので、すべての項目を繰り返すことで一覧表が表示されます。

13.　これで、Flashアンケート集計はできあがりです。
　　 [ファイル]－[名前をつけて保存...]メニューを選択し、「enquete.fla」という名前で保存します。

14.　[ファイル]－[パブリッシュ]メニューを選択して、「enquete.swf」「enquete.htm」の２つのファイルを書き出します。

■　サーバーへのアップロードと実行

1.　作成した「enquete.swf」「enquete.htm」と、前出の「enqdata.cgi」「enqdata.dat」の計４つのファイルを、サーバーにアップロードします。

2.　「enqdata.cgi」のパーミッションを「755」に、「enqdata.dat」のパーミッションを「666」に設定します。

3.　ブラウザで「enquete.htm」にアクセスしてみましょう。アンケートのページが表示されます。

4.　項目を選択して「アンケート送信」ボタンをクリックするか、「グラフを見る」ボタンをクリックすると、アンケートの集計結果が表示されます。

<<<戻る

Shirley's i-box | Shirley's little-box | Dreamweaver Technique | JAVA Script sample | CSS sample | JAVA Applet sample