ポンクソフト

フォームとの連動 - PHPでGDを使ってみよう

前ページ PHPでGDを使ってみよう TOP 次ページ

目次

  1. PHPでGDを使ってみよう
  2. GDの基本
  3. フォームとの連動
  4. アンケートで円グラフ

フォームで画像のパラメータを指定する

動的に画像を変化させる例として、フォームで入力された値を画像に反映させるプログラムを作成します。

フォーム部分のプログラム

まずフォーム部分のプログラムを作成します。以下のソースを入力してください。
<?php
$me = $_POST['me'];
if (!$me) $me = 50;
$kuchi = $_POST['kuchi'];
if (!$kuchi) $kuchi = 30;
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>ケロケロ</title>
</head>
<body>
<form method="post" action="gd3.php">
目の大きさ<select name="me">
<?php
for ($i = 10; $i <= 90; $i += 10) {
  print "<option";
  if ($i == $me) print " selected";
  print ">$i</option>\n";
}
?>
</select>
 口の大きさ<select name="kuchi">
<?php
for ($i = 10; $i <= 80; $i += 10) {
  print "<option";
  if ($i == $kuchi) print " selected";
  print ">$i</option>\n";
}
?>
</select>
 <input type="submit" value="送信">
</form>
<?php print "<img src='gd3b.php?me=$me&kuchi=$kuchi'>\n"; ?>
</body>
</html>
入力が終わったら「gd3.php」というファイル名で保存し、サーバにアップします。

画像部分のプログラム

次に画像部分のプログラムを作成します。以下のソースを入力してください。
<?php
$me = $_GET['me'];
$kuchi = $_GET['kuchi'];
header("Content-Type: image/png");
$img = imagecreate(200, 200);
imagecolorallocate($img, 100, 0, 0);
$col = imagecolorallocate($img, 50, 200, 50);
imagefilledarc($img, 100, 100, 180, 180, $kuchi, 360 - $kuchi, $col, IMG_ARC_PIE);
$col = imagecolorallocate($img, 255, 255, 0);
imagefilledellipse($img, 50, 50, $me, $me, $col);
imagepng($img);
?>
入力が終わったら「gd3b.php」というファイル名で保存し、サーバにアップします。その後、gd3.php を実行してみてください。目と口の大きさをフォームで変更することができます。

gd3.php ソースの解説

まずフォーム部分のソースを解説します。
$me = $_POST['me'];
if (!$me) $me = 50;
フォームからPOST変数で送られた目の大きさを変数 $me に代入しています。最初に実行されたときは初期値として 50 を代入します。
$kuchi = $_POST['kuchi'];
if (!$kuchi) $kuchi = 30;
フォームからPOST変数で送られた口の大きさを変数 $kuchi に代入しています。最初に実行されたときは初期値として 30 を代入します。
目の大きさ<select name="me">
目の大きさを指定するプルダウンメニューを作成します。
for ($i = 10; $i <= 90; $i += 10) {
  print "<option";
  if ($i == $me) print " selected";
  print ">$i</option>\n";
}
目の大きさを指定するプルダウンメニューの中身を作成します。目の大きさは 10 から 90 まで 10 刻みで指定できるように for 文を記述し、option タグを表示しています。現在の目の値が来たときは selected を出力して選択されるようにします。
口の大きさ<select name="kuchi">
口の大きさを指定するプルダウンメニューを作成します。
for ($i = 10; $i <= 80; $i += 10) {
  print "<option";
  if ($i == $kuchi) print " selected";
  print ">$i</option>\n";
}
口の大きさを指定するプルダウンメニューの中身を作成します。口の大きさは 10 から 80 まで 10 刻みで指定できるように for 文を記述し、option タグを表示しています。現在の口の値が来たときは selected を出力して選択されるようにします。
<?php print "<img src='gd3b.php?me=$me&kuchi=$kuchi'>\n"; ?>
img タグの src 属性に画像を出力するスクリプトを渡すことによって画像を出力しています。GET変数として、目と口の大きさを渡しています。

gd3b.php ソースの解説

次に画像表示部分のソースを解説します。
$me = $_GET['me'];
$kuchi = $_GET['kuchi'];
gd3.php から GET 変数で渡された目と口の大きさをそれぞれ $me と $kuchi に代入します。
imagefilledarc($img, 100, 100, 180, 180, $kuchi, 360 - $kuchi, $col, IMG_ARC_PIE);
円弧を使い、角度を上下にそれぞれ $kuchi 度だけ開けて口を表現しています。
imagefilledellipse($img, 50, 50, $me, $me, $col);
目を大きさ $me の円で表現しています。
前ページ PHPでGDを使ってみよう TOP 次ページ
このエントリーをはてなブックマークに追加 そっか0

このページに関するコメントをどうぞ

お名前:


wentgt
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/25 00:08

初心者
メールソフトの設定ってどうやるのですか...
gmailに送りたいのですが...
2017/01/24 21:33

enveloptf
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/24 21:23

paywinlv
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/24 18:04

anklebitcw
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/24 11:35

butterfxa
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/24 03:37

nhadeptronmr
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/23 20:39

nhadeptronlv
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/23 15:24

sinforve
すべての
calltrackingsource.com 13s.info nhadeptrongoi.com kashinvestment.com csgo-butterfly.com anklebitergaming.com
csfire.pro envelopesstore.com ginastarmusic.com mp3-teca.com csgoodstakes.com
went.black 2pay4win.com appliancerepairsnearme.com oferta-netflix.com
techitax.com csprey.com lightshadowspace.com csboom.pro
投稿者
2017/01/23 12:46

calltrackju
すべての
cbbnews24.com
csgobooms.com
csgojoybets.com
incareersjobs.com
stcmidtenn.org
thewill.in
sakirkaratas.com
apexturnkey.in
medray.in
applevalleymarket.com
b8b90.com
danhhotgay.com
cstopstake.com
nsm.org.in
vov-fc.com
csgohugepots.com
eaglesapparelshop.com
mymobileappmobiappssub2016.com
sbppl.org
gracedental.in
kehulin.com
cheappricetoyou2015.com
vamortgageloantexas.com
doitacdoanhnghiep.com
techimanage.com
elmi.co
upea.in
esncordoba.org
goal888cash.com
fullebookz.com
2winde222.com
投稿者
2017/01/23 09:37

残りを読む »