PHPで図形を描画!初心者でも分かる5ステップのガイド – Japanシーモア

PHPで図形を描画!初心者でも分かる5ステップのガイド

PHPで描かれた美しい図形のイラストPHP
この記事は約12分で読めます。

 

【サイト内のコードはご自由に個人利用・商用利用いただけます】

このサービスは複数のSSPによる協力の下、運営されています。

この記事では、プログラムの基礎知識を前提に話を進めています。

説明のためのコードや、サンプルコードもありますので、もちろん初心者でも理解できるように表現してあります。

基本的な知識があればカスタムコードを使って機能追加、目的を達成できるように作ってあります。

※この記事は、一般的にプロフェッショナルの指標とされる『実務経験10,000時間以上』を凌駕する現役のプログラマチームによって監修されています。

サイト内のコードを共有する場合は、参照元として引用して下さいますと幸いです

※Japanシーモアは、常に解説内容のわかりやすさや記事の品質に注力しております。不具合、分かりにくい説明や不適切な表現、動かないコードなど気になることがございましたら、記事の品質向上の為にお問い合わせフォームにてご共有いただけますと幸いです。
(送信された情報は、プライバシーポリシーのもと、厳正に取扱い、処分させていただきます。)

はじめに

あなたがこの記事を読んでいるということは、恐らく「PHPでどのようにして図形を描くことができるのか?」という疑問をお持ちなのではないでしょうか。

この記事を読めば、PHPを使って図形を描画することができるようになります。

一緒に学びましょう!

●PHPについて

PHPは、「PHP: Hypertext Preprocessor」の略で、サーバーサイドで動作するスクリプト言語です。

主にウェブ開発に使用され、HTMLを動的に生成するのに適しています。

○PHPの基本的な特徴

PHPは開発者がウェブアプリケーションを短期間で開発することを可能にする多くの特徴を備えています。

その一つが、HTMLとの親和性の高さです。

PHPコードはHTMLの中に直接埋め込むことができ、それにより動的なコンテンツを簡単に生成することができます。

○PHPでできること

PHPはデータベースと連携することが容易なため、動的なウェブサイトやウェブアプリケーションの作成に広く使用されています。

さらに、文字列操作や日付時刻の操作、ファイル操作など、様々な機能を提供しています。

そしてもちろん、図形を描画することも可能です。

●PHPでの図形描画について

PHPでは、GDというグラフィックライブラリを使用して図形を描画することができます。

これにより、線、長方形、円などの基本的な図形から、さらに複雑な図形まで、PHPで生成することが可能になります。

○図形描画の基本

図形を描画する際には、まずキャンバスとなる画像を作成します。

その上に、線や色を指定して図形を描きます。

これらの操作は全てGDライブラリの関数を使用して行います。

○PHPでの図形描画の仕組み

PHPで図形を描くためには、まずGDライブラリが必要となります。

これはPHPがデフォルトでサポートしているライブラリの一つで、画像の作成や操作を行う関数を提供しています。

PHPで図形を描画する際には、このGDライブラリの関数を使用します。

●PHPで図形を描く方法

それでは、PHPを使って具体的にどのように図形を描画するのか、具体的な手順とサンプルコードを紹介します。

まずは線を描画する方法から見ていきましょう。

○サンプルコード1:線を描く

<?php
// 画像を新規に作成します。
$image = imagecreatetruecolor(400, 300);

// 色を作成します。
$white = imagecolorallocate($image, 255, 255, 255);

// (100, 100)から(300, 200)に白い線を描きます。
imageline($image, 100, 100, 300, 200, $white);

// 画像を出力します。
header('Content-Type: image/png');
imagepng($image);

// メモリを開放します。
imagedestroy($image);
?>

このコードではimagecreatetruecolor関数を使って新しい画像を作成し、その上に線を描いています。imageline関数は、指定した2点間に線を描きます。

ここでは(100, 100)から(300, 200)に白い線を描いています。

○サンプルコード2:四角形を描く

次に、四角形を描く方法を見ていきます。

<?php
// 画像を新規に作成します。
$image = imagecreatetruecolor(400, 300);

// 色を作成します。
$red = imagecolorallocate($image, 255, 0, 0);

// (50, 50)から(200, 200)の四角形を描きます。
imagerectangle($image, 50, 50, 200, 200, $red);

// 画像を出力します。
header('Content-Type: image/png');
imagepng($image);

// メモリを開放します。
imagedestroy($image);
?>

このコードではimagerectangle関数を使って四角形を描いています。

この関数は、指定した2点を対角線の端点とする四角形を描きます。

○サンプルコード3:円を描く

次に、円を描く方法を見ていきます。

<?php
// 画像を新規に作成します。
$image = imagecreatetruecolor(400, 300);

// 色を作成します。
$green = imagecolorallocate($image, 0, 255, 0);

// 中心点(200, 150)、半径100の円を描きます。
imageellipse($image, 200, 150, 100, 100, $green);

// 画像を出力します。
header('Content-Type: image/png');
imagepng($image);

// メモリを開放します。
imagedestroy($image);
?>

このコードではimageellipse関数を使って円を描いています。

この関数は、指定した中心点と半径で円を描きます。

次に、ポリゴンを描き、最後にグラフを描く方法を見ていきましょう。

○サンプルコード4:ポリゴンを描く

ポリゴン(多角形)を描くにはimagepolygon関数を使います。

頂点の座標を配列で指定します。

<?php
// 画像を新規に作成します。
$image = imagecreatetruecolor(400, 300);

// 色を作成します。
$blue = imagecolorallocate($image, 0, 0, 255);

// 頂点の座標を配列にします。
$points = array(
   0 => 50,  1 => 50,
   2 => 200, 3 => 50,
   4 => 200, 5 => 200,
   6 => 50,  7 => 200
);

// ポリゴンを描きます。
imagepolygon($image, $points, count($points) / 2, $blue);

// 画像を出力します。
header('Content-Type: image/png');
imagepng($image);

// メモリを開放します。
imagedestroy($image);
?>

このコードでは、4つの頂点を持つ四角形のポリゴンを描いています。

○サンプルコード5:グラフを描く

最後に、簡単なバーグラフを描く方法を見ていきます。

<?php
// 画像を新規に作成します。
$image = imagecreatetruecolor(400, 300);

// 色を作成します。
$black = imagecolorallocate($image, 0, 0, 0);
$gray = imagecolorallocate($image, 200, 200, 200);

// データを作成します。
$data = array(7, 5, 8, 6);

// グラフを描きます。
$width = 20;
for ($i = 0; $i < count($data); $i++) {
    imagefilledrectangle($image, ($i * $width * 2), (count($data) - $data[$i]) * $width, ($i * $width * 2) + $width, count($data) * $width, $gray);
}

// 画像を出力します。
header('Content-Type: image/png');
imagepng($image);

// メモリを開放します。
imagedestroy($image);
?>

このコードでは、imagefilledrectangle関数を使って各バーを描いています。

配列$dataにある数値に基づいて、バーの高さを設定しています。

●図形描画の応用例

次に、基本的な図形の描画方法を組み合わせて、より複雑な図形を描画する方法を見ていきます。

例えば、複数の円を描画して花弁のような図形を作ったり、動的な図形を生成したりすることが可能です。

○サンプルコード6:複数の図形を組み合わせる

次のコードでは、複数の円を描画して花弁のような図形を作っています。

<?php
// 画像を新規に作成します。
$image = imagecreatetruecolor(400, 400);

// 色を作成します。
$white = imagecolorallocate($image, 255, 255, 255);

// 中心点と半径を定義します。
$centerX = 200;
$centerY = 200;
$radius = 50;

// 花弁を描きます。
for ($i = 0; $i < 6; $i++) {
    // 花弁の中心点を計算します。
    $petalX = $centerX + $radius * cos(deg2rad($i * 60));
    $petalY = $centerY + $radius * sin(deg2rad($i * 60));

    // 花弁を描きます。
    imageellipse($image, $petalX, $petalY, $radius, $radius, $white);
}

// 画像を出力します。
header('Content-Type: image/png');
imagepng($image);

// メモリを開放します。
imagedestroy($image);
?>

このコードでは、imageellipse関数を使って複数の円を描画しています。

forループを使用して6つの花弁を描いており、それぞれの花弁は60度ずつ回転しています。

○サンプルコード7:動的な図形の生成

次に、動的な図形を生成する方法を見ていきます。

ここでは、ランダムな位置に星形を描画するコードを紹介します。

<?php
// 画像を新規に作成します。
$image = imagecreatetruecolor(400, 400);

// 色を作成します。
$yellow = imagecolorallocate($image, 255, 255, 0);

// 星を描きます。
for ($i = 0; $i < 50; $i++) {
    // 星の位置とサイズをランダムにします。
    $centerX = rand(0, 400);
    $centerY = rand(0, 400);
    $size = rand(10, 50);

    // 星の点を定義します。
    $points = array();
    for ($j = 0; $j < 10; $j++) {
        $length = $size * ((($j % 2) == 0) ? 0.5 : 1);
        $points[] = $centerX + $length * cos(deg2rad($j * 36));
        $points[] = $centerY + $length * sin(deg2rad($j * 36));
    }

    // 星を描きます。
    imagefilledpolygon($image, $points, count($points) / 2, $yellow);
}

// 画像を出力します。
header('Content-Type: image/png');
imagepng($image);

// メモリを開放します。
imagedestroy($image);
?>

このコードでは、ランダムな位置とサイズで星を描画しています。

星は、10点の交互に長短が変わる頂点で構成され、imagefilledpolygon関数で描かれています。

このように、基本的な関数を組み合わせることで、PHPでさまざまな図形を描画することが可能です。

次に、描画時に注意すべき点と、カスタマイズ方法を見ていきましょう。

●注意点と対処法

図形を描画する際には、いくつかの注意点があります。

それらを理解し、適切に対処することで、より高品質な図形を生成することが可能となります。

まず、色を指定する際には、RGB値を正確に指定することが重要です。

RGB値は0から255の範囲で指定し、赤、緑、青の色を表現します。

たとえば、赤色は(255, 0, 0)、緑色は(0, 255, 0)、青色は(0, 0, 255)となります。

次に、描画した画像を出力する際には、適切なヘッダーを指定することが必要です。

ここでは’image/png’のヘッダーを指定して、PNG形式の画像として出力しています。

他の形式を出力する場合には、対応するヘッダーを指定する必要があります。

例えば、JPEG形式を出力する場合は’image/jpeg’を指定します。

最後に、画像リソースはメモリを消費するため、使用後はimagedestroy関数でメモリを解放することが推奨されます。

これにより、リソースの無駄遣いを防ぎ、パフォーマンスを向上させることが可能となります。

次に、図形描画のカスタマイズ方法について見ていきましょう。

●カスタマイズ方法

PHPの画像処理関数を使うと、図形描画を自由にカスタマイズすることができます。

例えば、図形の色やサイズ、位置を変更したり、異なる図形を組み合わせたりすることが可能です。

図形の色を変更するには、imagecolorallocate関数で新しい色を作成します。

この関数は、RGB値をパラメータとして受け取り、作成した色を返します。

図形のサイズや位置を変更するには、描画関数のパラメータを調整します。

例えば、imageellipse関数で円を描画する場合、中心の位置を表すパラメータや、半径を表すパラメータを変更することで、円の位置やサイズを変更することができます。

異なる図形を組み合わせるには、複数の描画関数を連続して呼び出します。

例えば、四角形と円を組み合わせて花瓶のような図形を描画することができます。

まとめ

以上が、PHPで図形を描画する方法の紹介です。

基本的な関数を使って線、四角形、円、ポリゴン、グラフを描画することができ、それらを組み合わせて複雑な図形を描画することも可能です。

注意点を理解し、適切に対処することで、高品質な図形を生成することができます。

PHPで図形を描画することは、Webサイトのビジュアルを向上させたり、データを視覚的に表示したりするための強力なツールとなります。

基本的な技術を身につけ、自由に図形を描画できるようになることを目指しましょう。