Category Archives: PHP Tips

PHP Tips (10):ブラウザにグラフを表示する

0
Filed under PHP Tips, PHP超入門

■ ブラウザに各種グラフを表示する ■

今までは、PHPプログラムの原理や、PHPプログラムを用いて、「あ~やる」「こ~やる」だのと、細々した内容をお話してきて、今ひとつ、自分の、あるいは会社のホームページで便利な内容というか、テクニックに乏しかったのではないかと思い、今回は、超実用的な内容についてお話したいと思います。

それは、サーバー上にあるデータから、グラフを生成して、それをユーザーのブラウザに表示させる、ということをしたいと思います。


で、今回の話のタネを先に言ってしまうと、PHPプログラム上で使用可能な、グラフ作成ツールはインターネット上でフリー(無料)で配布しているモノです。

こういったネットでのサービスというのは、世界が進んでいるのか、日本が遅れているのか、どちらが本当だか分かりませんが、「エッッ!!、こんなものが無料で利用できるの?」というサービスが海外のサイトにはイッパイありますネ~。


さて、実は、正直言うと、この稿は2度目の書き直しのモノなんです。

一度目は、どれか1つのグラフ作成プログラムを例に取り、実際に動きを確認する、といった流れを考えて、実際に途中までプログラムを書いたのですが、PHPによるグラフ作成プログラムについて調べると、結構な数のものが、しかも無料で公開されていることが分かりました。

中には、フラッシュを使った凝った表示ができるモノまであります。

こんなにバラエティーに富んだグラフ作成プログラムのうちの、たった1つを細々と紹介しても、チョット面白みに欠けるナ~と思い、今回は、それらPHPプログラムを羅列的に紹介するに留めました。

もし、その中で何か気に入ったものがありましたら、御連絡ください。

その際は、個別に対応したいと考えています。


振り返ってみると、数年前までは、ホームページにグラフを表示させようとする場合には、エクセルなんかで作ったグラフを切り取り、1つのイメージデータとしてホームページに表示していたものですが、今日では、プログラム的に、サーバーに置いてあるデータから直接・リアルタイムにグラフを生成できる時代なんだと、つくづくネットの世界の技術の発達は速いものだと感じいった次第です。


それでは、ネット上に公開されている、グラフ作成プログラムの一部です。

 PHP/SWF Charts
  http://www.maani.us/charts/index.php

 pChart – a PHP class to build charts
  http://pchart.sourceforge.net/

 JpGraph日本語版
  http://www.asial.co.jp/jpgraph/

 flot
  http://code.google.com/p/flot/

 Open Flash Chart
  http://teethgrinder.co.uk/open-flash-chart/

 amCharts
  http://www.amcharts.com/

 Emprise JavaScript Charts
  http://www.ejschart.com/

 Visifire
  http://www.visifire.com/

 FusionCharts Free
  http://www.fusioncharts.com/Free/


ちょっと調べただけでもこれだけ見つかりました。

検索エンジンで時間を掛ければ、まだまだ沢山みつかるのではないかと思います。


また、私個人としてはあまり興味がなかったので、あえてコンテンツとしては取り上げなかったのですが、会社、あるいはビジネスシーンで便利だと思われるのが、エクセルとの連携でしょう。

ここでは、私は実際に動作を確認はしていないのですが、こんな例があるようです。

 「Ver.1.44:Excel to グラフ生成ツール追加」

  http://ok2nd.blog87.fc2.com/blog-entry-75.html

Excelシートの取り込みには、PHP Excel読み込みツール「Spreadsheet_Excel_Reader」を使っています。
グラフ生成には、JavaScriptによるグラフ生成ツール「Bluff」および「HTML5」を使っています。

ブラウザで、Excelシートをアップロードすると、「Bluff」または「HTML5」でグラフ表示します。ボタンでグラフ種類やスタイルを変更できます。


こんな便利なツールもあるんですネ~。。。


なお、ここで、ちょっとした留意点ですが、以前、このメルマガで画像データを扱った時と同様、グラフも画像データの一種なので、PHPプログラムの動作を既定するファイル「php.ini」(←C:Windowsにあります)

124-1

の中の、

「;Windows Extensions」の部分に記述されている「;extension=php_gd2.dll」の「;」を外して、GDライブラリは利用可能にしておいた方がよいでしょう。

124-2

PHP Tips (9):ファイルのサーバーへのアップロード

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

以前、ネット上の掲示板やブログのように、ホームページに表示されたフォーに文字を入力すると、書き込んだ文字というか文章(テキスト)がサーバーのハードディスクに保存される内容について、(長々と)お話しました。

で、次のネタを何にしようかナ~、と考えていたのですが、今回は、それに類する事項として、Youtubeに代表されよるように、単なる文章(テキスト)に限らず、動画であろうが、画像であろうが、音楽データあろうが、どんなデータであろうと、ユーザーのパソコンの中にあるデータ(ファイル)をサーバーのハードディスクに保存させる方法です。

私個人としては、(ネタ自体はもの凄い前ですが)マイクロソフト社のサーバー・プログラムであるIIS(インターネット・インフォメーション・サービス)が有する、「Web共有」が、ドラッグ&ドロップでファイル操作が出来る等、ユーザーにとっては直感的で、分かりやすいんじゃないかと思うのですが、今回は、サーバー自身の機能ではなく、より汎用性があると思われるPHPプログラムを用いて、ファイルのアップローダーを考えてみます。


■ ファイル・アップローダー ■

。。。で、実際のプログラムの例を私なりに考えてみました。


先ずは、サーバーにアップロードする、ファイルを選択する画面です。

123-1

これは、単なるHTMLファイルなのですが、今回のフォームの動作指定の部分が、通常の少々異なり、特徴的な記述になっているのですが、ここで細かくお話すると、かなりマニアックな内容になってしまいますで、ここでは、チョット割愛したいと思います。


で、そのファイル・アップローダーの入り口となるHTMLファイルですが、私としては以下のようなモノを考えてみました。

———————————————————————-

<html>
<head>
<title>ファイルのアップロード</title>
</head>

<body>
手元のパソコンにあるファイルをサーバーに保存します。<br />
<br />

<form method=”post” enctype=”multipart/form-data” action=”123-2.php”>
<input type=”file” name=”data” size=”30″>
<input type=”submit” value=”アップロード”>
</form>

<br />
※「参照」ボタンをクリックして、ファイルを選択後、「アップロード」ボタンを押してください。<br />
</body>
</html>

———————————————————————-

そして、上記のHTML文を「123-1.htm」というファイル名で、「C:\Inetpub\wwwroot\php」フォルダに保存します。

123-2


ただ、上記のものは、単なるHTML文で、実際には、ユーザーが選択したファイルを「123-2.php」というものに渡し、このPHPプログラムが処理を行うことになります。

で、そのPHPプログラムなんですが、こんなのは如何でしょうか?

———————————————————————-

<?php

//ここで保存するフォルダを指定
$updir = “./”;

//アップロードされたファイルを変数に入れる
$filename = $_FILES['data']['name'];

//変数に入れたファイルをサーバーのハードディスクに保存
move_uploaded_file($_FILES['data']['tmp_name'], $updir.$filename);

print(”アップロード完了”);
?>

———————————————————————-

上記のPHPプログラムを「123-2.php」という名前で、「C:\Inetpub\wwwroot\php」フォルダに保存します。

123-3


以上で、準備は完了です。

では、早速、動作の確認を。。。

先ず、ブラウザを立ち上げて、アドレス欄に「http://localhost/php/123-1.htm」と入力します。

123-4


そして、ブラウザに表示された画面の「参照」ボタンをクリックし、

123-5


適当なファイルを選択した後、

123-6


「アップロード」のボタンを押すと、ブラウザの画面が切り替わり、「アップロード完了」というメッセージが表示されると思います。

123-7


これだけですと、何がナンだか、よく分からないと思いますので、エクスプローラを立ち上げて「C:\Inetpub\wwwroot\php」フォルダの中を、よ~く見てみると。。。

先程、選択したファイルがあるのが分かるんじゃないでしょうか?

123-8


これは、チョット専門的になるので、ここでは端折りますが、上記PHPプログラムにある、「$updir = “./”」の部分を書き換えることにより、サーバーのハードディスクの好きなフォルダに保存させるよう、自由に設定が変更可能です。

今回は、サーバーにあたるものが手元のパソコンなので、アップロードは、文字通り「あっ」という間に終わってしまいますが、インターネットを介して、ファイルのアップロードを行った場合、(ファイルサイズによっては)思いのほか時間が掛かりますので、この点については考慮にいれておいた方がいいんじゃないかと思います。


例えば、このようにアップロードに時間がかかる場合のユーザーインターフェイスを考えると、進行状況を示す画面(プログレス・バー)

http://gigazine.net/index.php?/news/comments/20070801_simple_ajax_progress_bar_with_css/

を示すほうがカッコイイと思いません?


以上で、今回のネタは終わりということで。。。

PHP Tips (8):複数のページ内容を一瞬で変える

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

もう、一年以上も続けていますが、現在、このメルマガでは、サーバー上で動くプログラミング言語の1つであるPHPというモノについて、延々とお話しています。

ココ最近は、他のプログラミング言語にありがちな、数字や文字等の処理ではなく、PHPというプログラミング言語は写真等の画像データも扱えますヨ~、というお話をしてきましたが、今回は、久しぶりに、文字を扱うお話にしようかと思います。

そして、これは、特にページ数の沢山あるホームページに利用価値のあるワザではないかと、私個人では考えています。


■ どんなにページ数があっても、一瞬で内容を変更する ■

それは、どんなワザかというと。。。サブタイトルのまんまです。

例えば、私のホームページの一番下には、

 「Copyright(c) 2002-2007 E&A工房. All Rights Reserved」

という文字が、表示されています。

122-1


実際の話、年も変わったので、「2002-2008」と直したいのですが、私のホームページの場合、100頁以上あるので、いちいち手作業で直して、それをサーバーに再びアップロードするのはエライ作業になります。

そ・こ・で、この部分には、最初にページを作成する時に、ある細工を埋め込んであります。

それは、「Copyright(c) 2002-2007 E&A工房. All Rights Reserved」というたった一行書かれたテキスト(文章)ファイルを予め用意し、そのファイルをサーバーのハードディスクに保存しておきます。

そして、ユーザーがホームページにアクセスして表示すると、自動的に、このテキスト(文章)ファイルを呼び出し、その内容を表示するようなプログラム処理を施しているのです。


■ 別ファイルを読み込む「include」関数 ■

話だけですと分かりづらいとも思いますので、手っ取り早く、簡単な実例でお見せしたいと思います。

先ずは、下記の内容をメモ帳等にコピペして、

122-2

 私のホームページへようこそ!!


「C:\Inetpub\wwwroot\php」フォルダに、「122-1.txt」という名前のファイル名で保存します。

122-3


そして、次はPHPプログラムを埋め込んだ、ファイルを作ります。

私としては、簡単ですが、次のようなものを考えてみました。

———————————-
<html>
<head>
<title>include関数のテスト</title>
</head>
<body>

<?php include ‘./122-1.txt’; ?>

</body>
</html>
———————————-


で、上記のファイルを、「C:\Inetpub\wwwroot\php」フォルダに、「122-2.php」という名前のファイルで保存してから、

122-4


ブラウザのアドレス欄に「http://locahost/php/122-2.php」と入力すると、上記のテキスト(文章)ファイルで保存した内容が表示されるかと思います。

122-5


では、ここで、あまり意味はないのですが、「PHPはHTML文の任意の部分に埋め込み可能である」という特徴を生かして、タイトル部分にも「include」関数を使ってみます。

上記と同様の要領で

 「タイトル部分にPHPを使用」

という文をメモ帳にコピペして、「C:\Inetpub\wwwroot\php」フォルダに「122-3.txt」というファイル名で保存します。

122-6


で、PHPプログラムを埋め込んだ、ファイルを以下のようにします。


———————————————-
<html>
<head>
<title><?php include ‘./122-3.txt’; ?></title>
</head>
<body>

<?php include ‘./122-1.txt’; ?>

</body>
</html>
———————————————-


上記の内容を、「C:\Inetpub\wwwroot\php」フォルダに、「122-4.php」という名前のファイルで保存します。

122-7


最後に、ブラウザのアドレス欄に「http://locahost/php/122-4.php」と入力すると、ブラウザのタイトル部分が、「122-3.txt」の内容に変わっていることに気が付くでしょう。

122-8


最初にもお話しましたように、私のホームページ(http://www.e-and-a.ws)の最下部に表示されている部分は、サーバーのハードディスクに保存してある、1個のテキスト(文章)ファイルの内容を自動的に読み込んで、表示させるような仕掛けを埋め込んであるので、このテキスト(文章)ファイルの内容を書き換えれば、全てのページで、書き換えた内容が反映される訳です。

また、詳しくお話すると、ま~た話が長くなってしまいますので、ここでは端折りますが、同じく、私のホームページの左側に表示されている縦のメニュー

122-9


も同じように、別に保存してあるファイルの内容を表示するような仕掛けをしてあります。


たかだか数ページのホームページですと、あまり実感が湧かないと思いますが、大量のページのホームページの場合、このテクの有難味は、(私も含めて)実感できるのではないかと思います。


次回は何をネタにしようかナ~・・・

ちょっと考えておきます。


。。。続く

PHP Tips (7):PHPプログラムで図形処理

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

何度も言うようですが、PHPというプログラミング言語は、単なる複雑な計算などの処理のほかに、ナント!!、円や線などの図が、(ブラウザ上に)書けてしまう、というお話をしてきています。

で、今回のお話なのですが、前回のお話の拡張版といった感じで、サーバー上にある画像データを加工する、といった点では同じなのですが、前回のお話に、さらに付け加えて、その画像データに文字を加えて、合成するといった内容です。

実際の例は、後ほど見ていただくとして、これが何の役に立つのか?という事ですが。。。

例えば、ホームページ上に写真のデータを掲載するとします。

その場合、その写真をユーザーは、インターネットエクスプローラの場合、マウスの「右クリック」→「名前を付けて画像を保存」という操作で簡単に自分のパソコンに保存できてしまいます。

で、その対策として、その写真の中に、ワザと「copy right ~」というような文字を埋め込み、写真のデータの質を落とすことより、ユーザーのパソコンに画像をコピーさせない、という使い方があるんじゃないかと思います。


その他にも、多分、イロイロな使い道があるとは思うのですが、それについては、あなたの御想像のままに。。。といったところでカンベンしてください。


では、早速、プログラムの実例を。。。


■ 画像と文字を合成して、画像データとしてブラウザに表示する ■

さてさて、先ずは実例その1です。

先ずは、チョ~単純な例として、ブラウザの画面の左上に黒色の四角を表示し、その四角の中に、自分の好きな文字を、白色で表示することにします。

私の考えた例では、その四角の中に、「Hello! PHP World」という文字を埋め込んで、ブラウザに表示させます。

私としては、今回、以下のようなPHPプログラムを考えてみました。


—————————————————-
<?php

$img = imagecreate(200, 100);

// 埋め込む文字を変数「$string」の中に代入します
$string = ‘Hello! PHP World’;

$bg = imagecolorallocate($img, 0, 0, 0);
$black = imagecolorallocate($img, 255, 255, 255);

// 左上の角に黒で、上の「$string」の内容を表示します
imagestring($img, 5, 10, 10, $string, $black);

header(’Content-type: image/gif’);
imagegif($img);

ImageDestroy($img);
?>
—————————————————-


上記の内容を、パソコンの「C:\Inetpub\wwwroot\php」フォルダに、ファイル名を「121-1.php」の名前で保存した後、

121-1

ブラウザのアドレス欄に「http://localhost/php/121-1.php」と入力してみると。。。


上でもお話したように、ブラウザの左上に、「Hello! PHP World」と書かれた、黒色の四角が表示されるかと思います。

121-2


モノは試しに、その画像の上で、マウスの「右クリック」→「プロパティ」で画像データの内容を確認してみると、ちゃんとGIF形式の画像である事が分かります。

121-3


今回のプログラムのキモとなるポイントは、

 imagestring($img, 5, 10, 10, $string, $black);

と記述されている、PHPに予め用意されている「imagestring()」関数です。

この、「imagestring()」関数の詳細についてですが。。。

ここで細かくお話すると、ヤタラ話が長くなりますので、スミマセンが、ここでは端折らせてください。

もし興味があれば、Google等で調べてみていただけないでしょうか?
申し訳ありません。。。


さて、上記プログラムで、画像データと文字「Hello! PHP World」を合成して表示させたのですが、この文字を日本語にしてみたらどうでしょうか?


結論から言うと、ダメみたいですね。。。

私の環境では文字化けしてしまい、うまく表示されませんでした。

121-4


多分、キチンと表示出来るのは、半角英数字だけだと思うのですが、いかがでしょうか?


■ サーバー上にある画像と文字を合成してブラウザに表示する ■

さて、次は、最初にお話したように、予めサーバー上に保存されている画像データに、自分の好きな文字を合成してブラウザに表示させるプログラムですます。

ここで、ブラウザに表示させる画像の元データですが、今回も前回同様、ビートルズのジョンレノンを偲んだ、「光の塔」の写真を使います。

120-3


この写真に、上記と同じ感覚で文字を合成したいと思うのですが、ここでは、単なる文字列だけではツマラナイので、サーバーの日付と時刻を表示したいと思います。

で、私が考えたプログラム例ですが、以下のようにしてみました。

下記のプログラムでは、サーバー上のフォルダ、すなわち、C:\Inetpub\wwwroot\php」フォルダに、上記の写真が予め「121-5.jpg」というファイルで保存されている事を前提にしています。

121-6


————————————————————
<?php
Header(’Content-Type: image/jpeg’);

$img = ImageCreateFromJpeg(’./121-5.jpg’);

// ここで、サーバー上の日付と時刻を変数「$date」に代入します
$date = date(’Y/m/d H:i:s’);

$black= ImageColorAllocate($img, 255, 255, 255);

// 今回のキモである「imagestring()」関数を使います
ImageString($img, 5, 10, 10, $date, $black);

ImageJpeg($img);
ImageDestroy($img);
?>
————————————————————


で、上記の内容を「C:\Inetpub\wwwroot\php」フォルダに「121-2.php」というファイル名で保存し、

121-7


次に、ブラウザのアドレス欄に「http://localhost/php/121-2.php」と入力してみると。。。


元の写真の左上に日付と時刻が乗っかった画像がブラウザに表示されませんか?

121-8


で、今回のプログラム例では、一回ブラウザに表示させた後、ブラウザの「再読み込み」のボタンをクリックする度に時刻の部分が刻々と変化していくのが分かると思います。


この例の場合、自分だけでやっていると面白くもなんともないですが、いざ、プログラムをネットに公開した場合を考えると、ネットのユーザーが画像を表示させた日付と時刻を、ユーザーのブラウザにリアルタイムに表示することになります。


今回の上の例では、シャレで、

 $date = date(’Y/m/d H:i:s’);

の部分で、関数を用いて、リアルタイムの日付と時刻を、変数「$date」に代入していますが、

例えば、

 $date = ‘Hello!! PHP World’;

という具合にすれば、固定した文字が画像と共にブラウザに表示されることになります。

121-9


■ PHPプログラムをHTMLの中で使う ■

さて、上記までに紹介した、PHPのプログラム例ですが、プログラムだけを示されてもチョット使いづらい、というか、通常のホームページで使われるHTML文の中でどうやって使ったらいいのか?という問題があるんじゃないかと思います。

。。。で、その対処方法です。


他にも方法があるんじゃないかと思いますが、私が思いつくのは、「img src」タグを使う方法です。


例えば、ですが。。。

またまた、このメルマガの特徴で、今回も内容が異様に長くなってしまうので、ここでは詳細は端折りますが、

以下のような、超単純なHTML文を考えてみました。


———————————————-
<html>
<head>
<title>画像と文字を合成</title>
</head>

<body>
画像と文字を合成して表示させるテストです。<br>
<br>
<img src=”./121-2.php”><br>

</body>
</html>
———————————————-


こうすれば、お手持ちのホームページビルダーなどのホームページの作成ソフトで、簡単に(?)HTML文が作成できると思います。。。

上記の内容をHTML文として保存し、ブラウザで開いてみると、ちゃんとホームページが表示されます。

121-10


当然の事ですが、上記のHTML文には、PHPのプログラムが指定されているので、上でお話したのと同様、ブラウザの「更新」ボタンをクリックする度に、表示される時刻が、刻々と変化していきます。


という具合に、HTML文の中でもPHPプログラムは好きなように使える、というお話でした。


次回は何をネタにしようかナ~・・・

ちょっと考えておきます。


。。。続く


PHP Tips (6):PHPプログラムで図形処理

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

何度も言うようですが、PHPというプログラミング言語は、単なる複雑な計算などの処理のほかに、ナント!!、円や線などの図が、(ブラウザ上に)書けてしまう、というお話をしてきています。

今までは、四角形とか、丸とか、比較的単純な図形を、プログラムで描かせた訳ですが、今回は、すでにサーバー上にある画像データを加工する、といったことにトライしてみたいと思います。


例えばの話なのですが、よく、ホームページのコンテンツに、小さい画像が羅列して表示されており(サムネイル表示)、その1つの画像をクリックすると、その画像が元の大きさで表示される、というのを結構目にします。


また、今までも何度かこのメルマガで書きましたが、この図形を出力するPHPプログラムをHTML文の中で利用するには、HTML文の「img」タグを使って、

 <img src=”(PHPのプログラムコード)”>

という書き方になります。


では、早速、プログラムの実例を。。。


■ サーバー上にある画像を縮小してブラウザに表示する ■

さてさて、ともあれ実例から。。。

先ずは、元となる画像ファイルです。

「何かイイものはないかな~」と探したのですが、ここでは、去年のものになりますが、ビートルズのジョンレノンを偲んで、世界の平和を願った、「光の塔」の写真を使います。

120-3


さて、この画像ファイル(別に上記のものでなくても構いません)を、「120.jpg」の名前で、「C:\Inetpub\wwwroot\php」フォルダに保存します。

120-1


そして、いよいよ、PHPプログラムの方です。

私としては、以下のようなものを考えてみました。

————————————————–

<?php
// ファイル
$filename = ‘120.jpg’;//← ここで縮小表示する画像ファイルを指定しています。
$percent = 0.5; //← 今回は1/2表示としました。

// コンテントタイプ
header(’Content-type: image/jpeg’);

// 新規サイズを取得します
list($width, $height) = getimagesize($filename);
$new_width = $width * $percent;
$new_height = $height * $percent;

// 再サンプル
$image_p = imagecreatetruecolor($new_width, $new_height);
$image = imagecreatefromjpeg($filename);
imagecopyresampled(
$image_p, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height
);

// 出力
imagejpeg($image_p, null, 100);
?>

————————————————–

そして、このPHPプログラムを、「120-1.php」の名前で、「C:\Inetpub\wwwroot\php」に保存します。

120-2


さて、先ずは、元の画像の表示です。

ブラウザのアドレス欄に「http://localhost/php/120.jpg」と入力すると、元の画像が表示されます。

120-3


そして、その画像の上で、マウスの右クリック→プロパティを見てみると、画像の大きさが「450×336ピクセル」であることが分かるんじゃないでしょうか?

120-4


では、いよいよ、次にPHPプログラムを走らせることにします。

ブラウザのアドレス欄に、「http://localhost/php/120-1.php」と入力してエ
ンターキーを押すと。。。

上記の画像よりも小さくなった画像が表示されるのではないでしょうか?

120-5


念のため、上記と同じく、その画像の上で、マウスの右クリック→プロパティを見てみると、画像の大きさが「225×168ピクセル」となっており、元の画像を見かけ上、小さく見せているのではなく、実際に画像が縮小されて表示されていることが分かります。

120-6


今までは、PHPによる画像処理の例は、見るだけ・試してみるだけなら面白いかもしれませんが、どつらかというと、あまり実用性はありませんでした。

ただ、今回の場合は、例えば、ネットショップの場合、商品の写真を一覧ページ用の小さいサイズの写真と、実際の販売ページ用の大きな写真の2種類を用意しなければなりませんでしたが、今回の例を応用すれば、写真は1枚だけ用意すればいいことになります。

そんな訳で、今回の例は、実用的な面でも少しは役に立つプログラムではないでしょうか?


。。。続く

PHP Tips (5):PHPプログラムで図形処理

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

何度も言うようですが、PHPというプログラミング言語は、単なる複雑な計算などの処理のほかに、ナント!!、円や線などの図が、(ブラウザ上に)書けてしまう、というお話をしてきています。

今までは、四角形とか、丸とか、比較的単純な図形を、プログラムで描かせた訳ですが、今回は、チョット複雑な図形に挑戦したいなと考えています。

でも、マァ、今回のようなケースを、実際のWebサイトのデザインの中に取り入れるケースは、殆どないであろう、と私個人としては考えているので、どちらかというと、お遊びの範疇に入る気がしないわけでもないですが。。。

また、今までも何度かこのメルマガで書きましたが、図形を出力するPHPプログラムをHTML文の中で利用するには、HTML文の「img」タグを使って、

 <img src=”(PHPのプログラムコード)”>

という書き方になります。

では、早速、プログラムの実例を。。。


■ ブラウザ上に多角形を表示する ■

先ずは、ともあれ実例から。

私としては、以下のようなものを考えてみました。

————————————————–

<?php
// 多角形の点の配列の準備
$values = array(

40, 50, // ←点1の位置 (x, y)
20, 240, // ←点2の位置 (x, y)
60, 60, // ←点3の位置 (x, y)
240, 20, // ←点4の位置 (x, y)
50, 40, // ←点5の位置 (x, y)
10, 10 // ←点6の位置 (x, y)
);


// 画像の生成
$image = imagecreatetruecolor(250, 250);

// 色の設定
$bg = imagecolorallocate($image, 200, 200, 200);
$blue = imagecolorallocate($image, 0, 0, 255);

// 多角形の描画
imagefilledpolygon($image, $values, 6, $blue);

// 画像の出力
header(’Content-type: image/png’);
imagepng($image);
imagedestroy($image);
?>

————————————————–


さて、上でも書きましたが、実際のホームページ作成の中で、PHPプログラムで描かせた多角形を使用するケースは、まず無いと思いますので、ココでは詳しいプログラムの解説は端折ります。

もし、イロイロ遊んでみたい場合は、

—————————————
// 多角形の点の配列の準備
$values = array(

40, 50, // ←点1の位置 (x, y)
20, 240, // ←点2の位置 (x, y)
60, 60, // ←点3の位置 (x, y)
240, 20, // ←点4の位置 (x, y)
50, 40, // ←点5の位置 (x, y)
10, 10 // ←点6の位置 (x, y)
);

—————————————

の数字を変えてみたり、ポイントの数を増やしたり減らしてりしてみて、どのように図形がブラウザに表示されるか確認してみるのも、いいかもしれません。


さて、上記プログラムを動かし、ブラウザに、どのように表示されるか見るには。。。

上記のPHPプログラムを「119-1.php」という名前のファイル名で、「C:\Inetpub\wwwroot\php」フォルダに保存します。

119-1

その後、ブラウザを立ち上げ、アドレス欄に「http://localhost/php/119-1.php」と入力すると、ブラウザに、黒字の背景の中に、青い星型の図形が表示されるのが分かると思います。

119-2


また、上記は、生のPHPプログラムそのものですが、これをHTML文の中で使用するには、<img>タグを利用して、


————————————————-
<html>
<head>
<title>青色の多角形をブラウザに表示させる</title>
</head>
<body>
青色の多角形を表示する<br />
<br />
<img src=”./119-1.php”><br />
</body>
</html>
————————————————-


そして、上記のHTML文を「119-2.htm」という名前のファイル名で、「C:\Inetpub\wwwroot\php」フォルダに保存します。

119-3

その後、ブラウザを立ち上げ、アドレス欄に「http://localhost/php/119-2.htm」と入力すると、前の場合と同様、文字と共にブラウザに青色の多角形が表示されるのが分かると思います。

119-4


そんな感じで、PHPプログラムで図形を取り扱う例を、何回かお話しましたが、今回の例はチョット実用性に乏しいので、次回は、実際のWebサイトの運営に少しは役立つ例を考えてみたいと思います。


。。。続く

PHP Tips (4):PHPプログラムで図形処理

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

何度も言うようですが、PHPというプログラミング言語は、単なる複雑な計算などの処理のほかに、ナント!!、円や線などの図が、(ブラウザ上に)書けてしまう、というお話をしてきています。

本屋さんで売られている書籍を見ると、稀に、図を描くプログラムを目にする場合もありますが、それを、ホームページの基本言語であるHTML文にどう書くかについて述べているものは全く無いんじゃないかと思います。


そこで、少し前の号になりますが、本邦初公開として、HTML文の「img」タグを使って、

 <img src=”(PHPのプログラムコード)”>

という書き方をご紹介いたしました。


そこで、今回は、上のような抽象的な書き方だけではナンなんで、実際の簡単な具体例を考えてみたいと思います。


■ ブラウザ上に円を表示する ■

先ずは、ともあれ実例から。

私としては、以下のようなものを考えてみました。

——————————————————–
<?php
header(”Content-Type: image/gif”);
$images = imagecreate( 150, 200 );

$white = imagecolorallocate( $images, 255, 255, 255 );
$blue = imagecolorallocate( $images, 0, 0, 200 );

imagerectangle( $images, 0, 0, 149, 99, $white);
imagearc( $images, 75, 50, 60, 60, 0, 360, $blue);

imagegif( $images );
imagedestroy( $images );
?>
——————————————————–


上記のPHPプログラムを「118-1.php」という名前のファイル名で、「C:\Inetpub\wwwroot\php」フォルダに保存します。

118-1


その後、ブラウザを立ち上げ、アドレス欄に「http://localhost/php/118-1.php」と入力すると、ブラウザに青色の丸が表示されるのが分かると思います。

118-2


さらにです。。。

上記は、生のPHPプログラムそのものですが、このPHPプログラムをHTML文と合体させて、


———————————————
<html>
<head>
<title>青色の円をブラウザに表示させる</title>
</head>
<body>
青色の円を表示する<br />
<br />
<img src=”./118-1.php”><br />
</body>
</html>
———————————————


そして、上記のHTML文を「118-2.htm」という名前のファイル名で、「C:\Inetpub\wwwroot\php」フォルダに保存します。

118-3


その後、ブラウザを立ち上げ、アドレス欄に「http://localhost/php/118-2.htm」と入力すると、前の場合と同様、文字と共にブラウザに青色の丸が表示されるのが分かると思います。

118-4


また、これは、話がやや逸れますが、上記PHPプログラムの中に

 「imagefill( $images, 75, 50, $blue);」

という一行を加えると。。。

——————————————————–
<?php
header(”Content-Type: image/gif”);
$images = imagecreate( 150, 200 );

$white = imagecolorallocate( $images, 255, 255, 255 );
$blue = imagecolorallocate( $images, 0, 0, 200 );

imagerectangle( $images, 0, 0, 149, 99, $white);
imagearc( $images, 75, 50, 60, 60, 0, 360, $blue);

imagefill( $images, 75, 50, $blue);
//↑ココです!!

imagegif( $images );
imagedestroy( $images );
?>
——————————————————–


青色で塗りつぶされた円がブラウザに表示されます。

118-5


そう、「imagefill()」関数は、指定した色で図形を塗りつぶす、図形専用の関数なのです。


そんな感じで、PHPプログラムで図形を取り扱う例をお話しましたが、今回だけですとナンですので、次回以降ももう少し他の例を考えてみたいと思います。


。。。続く

PHP Tips (3):PHPプログラムで図形処理

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

PHPという言語は、もともと、難しい表現を使うと、オープンソースの考え方で開発された言語であり、平たく言うと、とある単一の企業ではなく、世界中の有志のある人達によって開発・発展している言語です。

このために、本屋さんで売られている書籍には、「教科書」的なものは販売されていませんし、パソコンスクールなどでも、PHPを教えているところは殆どないと思います。
(以前、お話したかもしれませんが、プログラム言語も流行があり、今は、JavaやCなどが主流のようでし。。。)

マイクロソフト社のMOS資格のように、認定された基準や、試験等もありませんので、誰に、あるいは、どこを調べたらよいのか、サッパリ分からない、というのがPHPという言語を勉強していく上での難点だと個人的には思います。


そんな状況の中、唯一、公式、かつ、最新のPHPに関する情報が得られるのが、インターネットのPHPの本家サイトです。

  http://www.php.gr.jp/

ただ、この本家サイトですが、書籍とは違い、索引や目次がないので、チョット使いづらいです。

何が言いたいのかと言うと。。。


ここ、数回、このメルマガで、図(イメージ)をPHPプログラムで扱うことをお話しているのですが、その際、PHPという言語には、複雑な手続きを踏まずに、図(イメージ)に関する「関数」が予め用意されており、その関数を利用することにより、比較的容易に(?)図(イメージ)を扱えることを、実例を挙げてお話しきました。

では、その、図(イメージ)を扱う関数とは一体、どういったモノがあるのでしょうか。。。?


■ PHP関数一覧 ■

私も最初はよく分からなかったので、イロイロ調べたところ、公式ページとしては、以下のページに、図(イメージ)を扱う関数の一覧があります。

 PHP: イメージ – Manual
   http://www.php.net/manual/ja/ref.image.php


また、これは、2007年12月20日現在では、「実験的」と記載されていますが、サーバーノハードディスクに保存されている、画像ファイルのサネイルを表示する関数も用意されているみたいでする

 PHP: Imagick 画像ライブラリ – Manual
   http://www.php.net/manual/ja/ref.imagick.php


これは、どういうことかと言うと。。。

例えば、ネットのショッピングサイトなどの場合、商品の(大きな)画像を用意する一方、ユーザーの使い勝手を向上させるために、その大きな画像を縮小した画像(サムネイル)を用意し、それをホームページ上では、商品一覧として表示させる場合が多いですが、この「Imagick」関数を使えば、別途、小さい画像を準備しなくても、元の大きな画像から、自動的に(プログラム的に)小さな画像(サムネイル)を、ホームページ上に表示させることが出来ます。

こんな訳で、ショッピングサイト開設者は重宝する関数ではないかと思います。

また、これは、少々難しい表現になりますが、この小さな画像(サムネイル)を表示する処理は、サーバー側で行いますので、ブラウザに依存することはありません。

ということは。。。

そう、携帯サイトでも利用可能だということです。

携帯サイト開設者は、知っておいて損はない話だと思います。


■ PHP関数動作の一覧 ■

今まで、このメルマガで2回程、PHPの関数を用いて、

  • 直線を引く

  • 円を描く


の2つの例をお話しましたが、PHPの関数には、まだまだ沢山の機能が準備されています。

ここで、現在のバージョンの機能を一部を列挙してみますと、

  • 画像の大きさを取得する


  • ブラウザまたはファイルにイメージを出力する


  • 部分楕円を描画する


  • 水平に文字を描画する


  • 垂直に文字を描画する


  • 画像で使用する色を作成する


  • 画像で使用する色を透過度を指定して作成する


  • 指定した色に最も近い色のインデックスを取得する


  • 画像の一部をコピーする


  • イメージの一部をコピー、マージする


  • グレースケールでイメージの一部をコピー、マージする


  • 再サンプリングを行いイメージの一部をコピー、伸縮する


  • 画像の一部をコピーしサイズを変更する


  • ファイルまたは URL から新規画像を作成する


  • ファイル又は URL から新規 JPEG 画像を作成する


  • ファイルまたは URL から新規イメージを作成する


  • 破線を描画する


  • 楕円を描画する


  • 塗り潰す


  • 部分楕円を描画し、塗りつぶす


  • 塗りつぶされた楕円を描画する


  • 塗りつぶした多角形を描画する


  • 塗りつぶした矩形を描画する


  • 特定色で塗りつぶす


  • 画面全体をキャプチャする


  • ウィンドウをキャプチャする


  • 多角形を描画する


  • 矩形を描画する


  • 指定された角度で画像を回転する


  • 線の描画用にブラシイメージを設定する


  • 画像の幅を取得する


  • 画像の高さを取得する


  • TrueType フォントを使用してテキストを画像に書き込む


上記の機能は、ほんの一例であり、まだまだ、私も使い方すら分からない、沢山の関数が準備されています。

私自身も、今回、自分の手で実際に調べてみて、本当にビックリしたくらいです。


そんな訳で、次回のネタは、未だ考えていませんが、今回のメルマガは、割と教科書的な堅苦しい話になってしまいましたので、次回は、以前と同様、実際に、図(イメージ)を取り扱う関数を用いた、実際例を考えてみたいと思います。


。。。続く

PHP Tips (2):PHPプログラムで図形処理

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

前回から、PHPプログラミングのTips的な話題として、PHPプログラムでブラウザに図形を表示させる、という事をお話しています。


前回にも紹介しましたが、例えば、

————————————————-
<?php

header(”Content-Type: image/gif”);
$image = imagecreate(120,120);

$black = imagecolorallocate($image,0,0,128);
$yellow = imagecolorallocate($image,255,255,0);

imageline($image,10, 60, 110, 60, $yellow);
imageimg($image);
imagedestroy($image);

?>
————————————————-

というPHPプログラムを実行すると、青地の四角に一本の黄色い横線が引かれた図がブラウザに表示されると思います。

115-2


これは、PHPには、図形を取り扱う「関数」というものが既定の状態で準備されていて、様々な図形(「四角」とか「三角」とか「円形」とか。。。)を複雑な手続きをせずにブラウザに表示させることが可能なのです。


ただ、その図形を取り扱う関数、例えば、上の例で言えば「imagecolorallocate()」関数なのですが、その括弧「()」の中の設定についての説明は、かなり難しく、多分、本屋で売られている殆どの書籍には説明が無いんじゃないかと思います。

こういった、図形を取り扱う関数の詳細については、Google等の検索エンジンで調べる他、今は方法はないでしょう。
(例えば、「PHP 図形 関数」といった3キーワードで検索する、など)

そんな訳で、難しくて詳細なお話は、このメルマガの趣旨ではないので、ここではサラッと流し、簡単な紹介に留めたいと考えています。


■ 色地の四角に丸を書くプログラム ■

そこで、今回のPHPプログラムです。

題名にもありますが、「白地の四角の中に、青色の丸を描く」PHPプログラムです。

あくまでも、「例」ですが。。。

まず、下記のPHPプログラムを、「116-1.php」というファイル名で、「C:\Inetpub\wwwroot\php」フォルダに保存います。

116-1


——————————————————–
<?php
header(”Content-Type: image/gif”);
$images = imagecreate( 150, 200 );

$white = imagecolorallocate( $images, 255, 255, 255 );
$blue = imagecolorallocate( $images, 0, 0, 200 );
$border = imagecolorallocate( $images, 0, 0, 0);

imagerectangle( $images, 0, 0, 149, 99, $white);
imagearc( $images, 75, 50, 60, 60, 0, 360, $blue);
imagefill( $images, 75, 50, $blue);

imagegif( $images );
imagedestroy( $images );
?>

——————————————————–

その後、ブラウザを立ち上げ、アドレス欄に「http://localhost/php/116-1.php」と入力すると、ブラウザに青色の丸が表示されるのが分かると思います。

116-2


ここで、上のPHPプログラムの「imagecolorallocate( $images,0,0,200 )」に書かれている「0,0,200」の三つの数字をイロイロ変えてみると、このブラウザに表示された丸の色がイロイロ変化することが分かると思います。

ただ、この段階では、「青色の丸」は分かりましたが、「白地の四角」というのが分かりません。


そして、問題なのは、前回紹介したPHPプログラムと同様、今回のPHPプログラムもそうなのですが、確かに、PHPプログラムで図形を取り扱えることは分かったものの、通常、ブラウザに表示させる基本となるHTML文との関連が不明で、PHPプログラム単体では、どうにも応用が難しい、というのが正直なところではないでしょうか?


■ HTML文にPHPプログラムを埋め込む ■

そこで、何か良い方法はないものかと、検索エンジンでイロイロ探したところ、アリマシタッッ!!

そう、HTML文内で図形を取り扱う「タグ」の1つである、「img タグ」を使う方法です。


例えば、下記のような例を考えてみました。

———————————
<HTML>
<HEAD>
<TITLE>青い円を描くテスト</TITLE>
</HEAD>
<BODY bgcolor=”#ff8040″>
<img src=”./116-1.php”><br />
</BODY>
</HTML>
———————————

上記の内容をコピペして、「116-2.htm」というファイル名で、「C:\Inetpub\wwwroot\php」フォルダに保存います。

116-3


その後、ブラウザのアドレス欄に「http://localhost/php/116-2.htm」と入力すると。。。

「白地の四角の中に、青色の丸」が表示されるのが分かると思います。

116-4


通常、「img タグ」は、「xxx.gif」とか、「xxx.jpeg」等の画像ファイルそのもと一緒に使われることが殆どですが、今回のような場合は、見方を変えると「PHPプログラムそのもの」が画像ファイルとして扱われている、とも考えられます。


何か不思議な気がしない訳でもありませんが。。。


このように、PHPプログラムと、通常のHTML文とが融合して使える、と分かると、応用の範囲がグッと広まるのではないかと考えています。


次回のネタは、未だ考えていませんが、今回と同様に、PHPプログラムで図形を扱うことを予定しています。


。。。続く

PHP Tips (1):PHPプログラムで図形処理

0
Filed under PHP Tips, PHP超入門

■ 前置き ■

前回までは、長い期間にわたり、

「サーバーのハードディスクにブラウザを利用して、文章(テキスト)ファイルを保存したり、修正したりする」



ということを、ズ~~~とお話してきました。



そして、チョット、みっともない形でしたが、前回をもちまして、一応の決着をみた訳です。





そして、次回(というか今号)から、何について、お話しようかと考えていました。





ここで、通常ですと、PHPプログラミングから、データベースのお話、という感じになるのでしょうが、それですと、書店に並んでいる、イロイロな解説本と同じようになってしまいますし、SQL文の解説等、面倒なことになってしまいますので、ここでは、チョット視線を変えた、PHPプログラミングのお話をしたいと思います。





それは、何かと言いますと。。。



そう、PHPのプログラミングで、「絵が描ける」という事について、お話しようと思います。



■ プログラム(コード)の詳細 ■

なにはともあれ、先ずは、実例からです。

下記のPHPのプログラム(コード)をコピペして、「C:\Inetpub\wwwroot\php」フォルダに、「115-1.php」という名前で保存します。

115-1


————————————————-
<?php

header(”Content-Type: image/gif”);
$image = imagecreate(120,120);

$black = imagecolorallocate($image,0,0,128);
$yellow = imagecolorallocate($image,255,255,0);

imageline($image,10, 60, 110, 60, $yellow);
imageimg($image);
imagedestroy($image);

?>
————————————————-

今は、何がナンダカ分からないと思いますが、とりあえず、上記の操作をした後、ブラウザのアドレス欄に

  http://localhost/php/115-1.php

と入力すると、ブラウザには青地の四角の中に、黄色い一本の線が引かれた図が表示されたかと思います。

115-2


実際、その画像の上で右クリックから、「プロパティ」をクリックして、表示された画像を調べてみると、チャント、GIF形式の画像(イメージ)であることが確認できるかと思います。

115-3


そう、詳しくは、ここでは端折りますが、今まで、何回かPHPプログラミングの話で、「関数」という事をお話してきましたが、PHPには、画像を生成する「関数」が標準で装備されています。


現在、このメルマガでは、今年でサポートが終了される、Ver.4についてお話していますが、多分、Ver.5でもサポートしていると思います。(←確認はしていませんが。。。汗)


■ 上記のプログラム(コード)が動かなかった場合 ■

私の場合、特に何もしなくても、上記のプログラム(コード)は動きましたが、もし、動かなかった場合、下記の事を確認してみてください。

そして、修正後は、サーバープログラムを再起動するか、パソコン自体を再起動します。


LINUX(Unix)の場合は確認していませんが、Windowsの場合、PHPを標準の状態でインストールすると、PHPプログラムの動作は、「C:\WINDOWS」フォルダにある、「php.ini」というファイルで記述されている内容に従います。

115-4


そこで、メモ帳でその「php.ini」を無理矢理開いてみますと。。。

なんやら、訳の分からない英語が数百行にわたり書いてあります。

そこで、メモ帳の検索機能を使い、「extension=php_gd2.dll」という文字列を探します。

そして、もし、見つかった、その「extension=php_gd2.dll」の文字列の先頭に、「;」という記号が付いていたら、この「;」の記号を削除し、上書き保存します。

115-5

ここでは詳しくは、お話しませんが、実は、この「php.ini」に記述されている内容から、PHPという言語は様々な機能が内包されているのです。


■ お絵かきプログラムの可能性 ■

上記の例は、非常に簡単な内容のものであったので、実用性に乏しい、というのが実際の印象だとは思いますが、「PHPプログラムで図(イメージ)が生成できる」という考えを延長すると。。。

例えば、単なるHTML文に埋め込まれた、「静的」なものではなく、「動的」に「グラフ」をブラウザに表示させることが出来るんじゃないかと思いませんか?

で、実際に調べてみると。。。

ありましたっっ!!

例えば、

  http://www.qualityunit.com/postgraph/

などです。

英語のサイトですし、プログラム(コード)も複雑なので、思わず、眩暈がしそうですが。。。

上記のサイトは、ほんの一例ですが、PHPでグラフを表示させる事に関するキーワードで検索してみると、有料・無料問わず、いろいろなプログラム(ソースコード)が入手できることが分かると思います。


このように、動的にグラフが作成可能、ということが分かると、

普段のデータはエクセル(本当なら、アクセス以上のデータベース)に保存

      ↓

ホームページには、そのデータを元に、自動的にグラフを作成するPHPプログラムを埋め込んでおく

      ↓

ユーザー、ホームページにアクセスすると、自動的かつ、リアルタイムにブラウザにグラフを作成


という流れが可能です。


グラフ自体は、単なる画像(イメージ)データなので、PCのみならず、携帯にも表示可能です。


PHPプログラムによる画像(イメージ)データの取り扱いは、まだまだ、沢山の例がありますので、もう少し、探っていきたいと思います。


。。。続く