Cara menggunakan gd library in php

Buat gambar di PHP dengan fasilitas library bawaan yaitu GD mungkin adalah fasilitas yang sudah lama dikenal. Dengan fasilitas ini kita dapat membuat gambar atau grafik dengan code-code yang kita buat, tentunya code PHP. Berikut adalah penjelesan singkatnya.

Table of Contents Show

Rectangle With Text
Bermain dengan Font
Menggambar Garis
Menggambar Ellipse
Arcs & Pies
Membungkus Dasar-dasar

Awal Setingan Library GD

Dalam pemrograman PHP kita dapat membuat grafik atau chart pada halaman web kita. Sebelum membuat suatu grafik atau chart pada pemrograman PHP kita perlu mengaktifkan GD pada library, tepatnya di php.ini. Kalau kamu menggunakan wamp, kamu bisa mengeditnya di folder wamp-php-php.ini.

Buka php.ini dengan notepad, lalu tekan tombol ctrl-f untuk mencari kata “php_gd.dll” atau “php_gd2.dll”. Cari php_gd.dll atau php_gd2.dll di sebaris

;extension=php_gd.dll
;extension=php_gd2.dll

bila ketemu, hapus tanda ; yang berarti mengaktifkan library GD tersebut.

Membuat Bidang Gambar

Seperti halnya bila kita membuat suatu gambar pada photoshop atau image editing lainnya, kita harus membuat bidang gambarnya dulu. Kalau dalam photoshop mungkin sama halnya kita membuat new photo lalu menentukan panjang, lebar dan warna dari bidang photo kita. Nah kalau di PHP kita buat dengan perintah :

imagecreate(x,y);

perintah tersebut adalah membuat bidang gambar pada PHP. x adalah lebar sedangkan y adalah panjang dari bidang gambar yang akan kita buat. Sedangkan bila kita ingin memberi warna pada bidang gambar (background) tersebut kita buat dengan perintah :

imagecolorallocate(bidang_gambar, warnaRed, warnaHijau, warnaBiru);

dimana nilai dari warna adalah bentuk RGB (Red, Green, Blue).

Berikut adalah contoh membuat sebidang kotak berwarna biru dengan ukuran panjang 120 dan lebar 100.

<html>

<head>

<title>Image PHP</title>

</head>

<body>

<?php

	$image = @imagecreate(100,120) or die ("Maaf tidak bisa membuat gambar");

	$bg_color = imagecolorallocate($image,0,0,255);

	#simpan gambar pada folder img dan beri nama gambar.png

	imagepng($image,"img/gambar.png");

	imagedestroy($image);

	#Tampilkan pada browser

	echo "<img src='img/gambar.png'>";

?>

</body>

</html>

Kalau kita perhatikan bahwa code diatas membuat gambar dengan tipe PNG menggunakan perintah imagepng(). Selain PNG tentunya kita bisa membuat tipe lain seperti GIF dengan perintah imagegif(), tipe BMP dengan perintah imagebmp(), JPG dengan perintah imagejpeg().

Membuat Garis

Setelah kita membuat bidang gambar, maka selanjutnya kita mulai menggambar. Berikut ini adalah membuat garis pada bidang yang telah kita buat dengan perintah :

imageline(bidang_gambar, x1, y1, x2, y2, warna_garis);

Bila kita membuat sebuah garis, sebenarnya adalah kita menarik garis dari satu titik ke titik lainnya yang tentunya pada letak yang berbeda. Nah maksud dari x1, y1 adalah titik pertama sedangkan x2,y2 adalah titik kedua.

Sebagai contoh, saya buat suatu gambar garis dengan warna merah dan posisi titik awal adalah x=10,y=10 dan titik kedua dengan x=90,y=90.

<html>

<head>

<title>Gambar Garis</title>

</head>

<body>

<?php

	#buat bidang gambar

	$image = @imagecreate(100,100)or die("gambar tidak dapat dibuat");

	#buat background bidang gambar

	$background = imagecolorallocate($image,100,123,4);

	#buat variable untuk warna garis

	$merah = imagecolorallocate($image,255,0,0);

	#buat garisnya

	imageline($image,10,22,90,90,$merah);

	imagejpeg($image,"img/gambar1.jpg");

	imagedestroy($image);

	#tampilkan imagenya

	echo "<img src='img/gambar1.jpg'>";

?>

</body>

</html>

Hal penting dalam penentuan titik adalah letak titik tidak boleh lebih dari panjang dan lebar dari bidang gambar kita.

Lumayan menarik bukan ? Sebenarnya kita bisa membuat beragam bentuk di library GD ini namun sekarang penggunaannya telah tergantikan dengan adanya library tambahan yaitu jpgraph yang lebih bagus bentuk dan penerapannya. Bagi yang ingin lebih tentang membuat grafik atau image dengan pemrograman PHP (library GD) bisa baca langsung manual php-nya.

Same is shown of text, but you can use any html content imges, videos, etc inside this box

You can choose to have carousal or just a single html content

Carousal is a good way to show ads, to keep user engaged.

Sebelumnya coba cek daftar konfigurasi ekstensi yang aktif pada instalasi PHP Anda dengan menggunakan phpinfo() apakah GD termasuk di dalam daftar yang aktif atau tidak. Jika ternyata tidak aktif maka coba buka dan edit file php.ini Anda. Untuk lokasi file ini tergantung instalasi Anda.

Pustaka GD digunakan untuk pembuatan gambar dinamis. Dari PHP, kami menggunakan pustaka GD untuk membuat gambar GIF, PNG, atau JPG langsung dari kode kami. Ini memungkinkan kita untuk melakukan hal-hal seperti membuat grafik dengan cepat, menciptakan citra keamanan anti-robot, membuat gambar thumbnail, atau bahkan membangun gambar dari gambar lain.

Jika Anda tidak yakin jika Anda memiliki pustaka GD, Anda dapat menjalankan phpinfo () untuk memeriksa apakah Dukungan GD diaktifkan. Jika Anda tidak memilikinya, Anda dapat mengunduhnya secara gratis.

Tutorial ini akan membahas dasar-dasar pembuatan gambar pertama Anda. Anda seharusnya sudah memiliki beberapa pengetahuan PHP sebelum memulai.

02 07

Rectangle With Text

(unsplash.com/Pexels.com/CC0)> $ handle = ImageCreate (130, 50) atau mati ("Tidak Dapat Membuat gambar"); $ bg_color = ImageColorAllocate ($ handle, 255, 0, 0); $ txt_color = ImageColorAllocate ($ handle, 0, 0, 0); ImageString ($ handle, 5, 5, 18, "PHP.About.com", $ txt_color); ImagePng ($ pegangan); ?>

Dengan kode ini, kami membuat gambar PNG. Di baris pertama kami, tajuk, kami mengatur tipe konten. Jika kami membuat gambar jpg atau gif, ini akan berubah sesuai.
Selanjutnya, kita memiliki pegangan gambar. Dua variabel dalam ImageCreate () adalah lebar dan tinggi persegi panjang kami, dalam urutan itu. Persegi panjang kami memiliki lebar 130 piksel dan tinggi 50 piksel.
Selanjutnya, kami mengatur warna latar belakang kami. Kami menggunakan ImageColorAllocate () dan memiliki empat parameter. Yang pertama adalah pegangan kami, dan tiga berikutnya menentukan warna. Mereka adalah nilai Merah, Hijau dan Biru (dalam urutan itu) dan harus berupa bilangan bulat antara 0 dan 255. Dalam contoh kita, kita telah memilih merah.
Selanjutnya, kami memilih warna teks kami, menggunakan format yang sama dengan warna latar belakang kami. Kami telah memilih hitam.
Sekarang kita masukkan teks yang ingin kita tampilkan dalam grafik kita menggunakan ImageString () . Parameter pertama adalah pegangannya. Kemudian font (1-5), mulai X ordinat, mulai Y ordinat, teks itu sendiri, dan akhirnya warnanya.
Akhirnya, ImagePng () benar-benar menciptakan gambar PNG.

03 07

Bermain dengan Font

(Susie Shapira / Wikimedia Commons)> $ handle = ImageCreate (130, 50) atau mati ("Tidak Dapat Membuat gambar"); $ bg_color = ImageColorAllocate ($ handle, 255, 0, 0); $ txt_color = ImageColorAllocate ($ handle, 0, 0, 0); ImageTTFText ($ handle, 20, 15, 30, 40, $ txt_color, "/Fonts/Quel.ttf", "Quel"); ImagePng ($ pegangan); ?>

Meskipun sebagian besar kode kami tetap sama Anda akan melihat kami sekarang menggunakan ImageTTFText () bukan ImageString () . Ini memungkinkan kita untuk memilih font kita, yang harus dalam format TTF.

Parameter pertama adalah pegangan kami, kemudian ukuran font, rotasi, mulai X, mulai Y, warna teks, font, dan, akhirnya, teks kami. Untuk parameter font, Anda perlu menyertakan path ke file font. Untuk contoh kami, kami telah menempatkan font Quel di folder bernama Font. Seperti yang Anda lihat dari contoh kami, kami juga mengatur teks untuk dicetak pada sudut 15 derajat.

Jika teks Anda tidak ditampilkan, Anda mungkin memiliki path ke salah font Anda. Kemungkinan lainnya adalah parameter Rotasi, X, dan Y Anda menempatkan teks di luar area yang dapat dilihat.

04 07

Menggambar Garis

(Pexels.com/CC0)> $ handle = ImageCreate (130, 50) atau mati ("Tidak Dapat Membuat gambar"); $ bg_color = ImageColorAllocate ($ handle, 255, 0, 0); $ txt_color = ImageColorAllocate ($ handle, 255, 255, 255); $ line_color = ImageColorAllocate ($ handle, 0, 0, 0); ImageLine ($ handle, 65, 0, 130, 50, $ line_color); ImageString ($ handle, 5, 5, 18, "PHP.About.com", $ txt_color); ImagePng ($ pegangan); ?>

Dalam kode ini, kami menggunakan ImageLine () untuk menggambar garis. Parameter pertama adalah pegangan kami, diikuti oleh awal kami X dan Y, akhir X dan Y, dan akhirnya, warna kami.

Untuk membuat gunung berapi yang sejuk seperti yang kita miliki dalam contoh kita, kita cukup menempatkan ini menjadi satu lingkaran, menjaga koordinat awal kita tetap sama, tetapi bergerak sepanjang sumbu x dengan koordinat akhir kita.

> $ handle = ImageCreate (130, 50) atau mati ("Tidak Dapat Membuat gambar"); $ bg_color = ImageColorAllocate ($ handle, 255, 0, 0); $ txt_color = ImageColorAllocate ($ handle, 255, 255, 255); $ line_color = ImageColorAllocate ($ handle, 0, 0, 0); untuk ($ i = 0; $ i <= 129; $ i = $ i + 5) {ImageLine ($ handle, 65, 0, $ i, 50, $ line_color); } ImageString ($ handle, 5, 5, 18, "PHP.About.com", $ txt_color); ImagePng ($ pegangan); ?>

05 07

Menggambar Ellipse

(Pexels.com/CC0)> $ handle = ImageCreate (130, 50) atau mati ("Tidak Dapat Membuat gambar"); $ bg_color = ImageColorAllocate ($ handle, 255, 0, 0); $ txt_color = ImageColorAllocate ($ handle, 255, 255, 255); $ line_color = ImageColorAllocate ($ handle, 0, 0, 0); imageellipse ($ handle, 65, 25, 100, 40, $ line_color); ImageString ($ handle, 5, 5, 18, "PHP.About.com", $ txt_color); ImagePng ($ pegangan); ?>

Parameter yang kita gunakan dengan Imageellipse () adalah pegangan, koordinat pusat X dan Y, lebar dan tinggi elips, dan warnanya. Seperti yang kita lakukan dengan garis kita, kita juga dapat menempatkan elips kita ke dalam lingkaran untuk menciptakan efek spiral.

> $ handle = ImageCreate (130, 50) atau mati ("Tidak Dapat Membuat gambar"); $ bg_color = ImageColorAllocate ($ handle, 255, 0, 0); $ txt_color = ImageColorAllocate ($ handle, 255, 255, 255); $ line_color = ImageColorAllocate ($ handle, 0, 0, 0); untuk ($ i = 0; $ i <= 130; $ i = $ i + 10) {imageellipse ($ handle, $ i, 25, 40, 40, $ line_color); } ImageString ($ handle, 5, 5, 18, "PHP.About.com", $ txt_color); ImagePng ($ pegangan); ?>

Jika Anda perlu membuat elips yang solid, Anda harus menggunakan Imagefilledellipse () sebagai gantinya.

06 07

Arcs & Pies

(Calqui / Wikimedia Commons / CC BY-SA 3.0)> < header ('Content-type: image / png'); $ handle = imagecreate (100, 100); $ background = imagecolorallocate ($ handle, 255, 255, 255); $ red = imagecolorallocate ($ handle, 255, 0, 0); $ green = imagecolorallocate ($ handle, 0, 255, 0); $ blue = imagecolorallocate ($ handle, 0, 0, 255); imagefilledarc ($ handle, 50, 50, 100, 50, 0, 90, $ red, IMG_ARC_PIE); imagefilledarc ($ handle, 50, 50, 100, 50, 90, 225, $ blue, IMG_ARC_PIE); imagefilledarc ($ handle, 50, 50, 100, 50, 225, 360, $ green, IMG_ARC_PIE); imagepng ($ handle); ?>

Menggunakan imagefilledarc kita bisa membuat kue, atau sepotong. Parameternya adalah: pegangan, pusat X & Y, lebar, tinggi, mulai, akhir, warna, dan jenis. Titik awal dan akhir dalam derajat, mulai dari posisi jam 3.

Jenisnya adalah:

IMG_ARC_PIE- Arsip yang diisi
IMG_ARC_CHORD- diisi dengan straight edge
IMG_ARC_NOFILL- bila ditambahkan sebagai parameter, membuatnya tidak terisi
IMG_ARC_EDGED- Menyambungkan ke tengah. Anda akan menggunakan ini dengan nofill untuk membuat kue yang belum diisi.

Kita dapat meletakkan busur kedua di bawahnya untuk menciptakan efek 3D seperti ditunjukkan pada contoh di atas. Kita hanya perlu menambahkan kode ini di bawah warna dan sebelum busur diisi pertama.

> $ darkred = imagecolorallocate ($ handle, 0x90, 0x00, 0x00); $ darkblue = imagecolorallocate ($ handle, 0, 0, 150); // Tampilan 3D untuk ($ i = 60; $ i> 50; $ i--) {imagefilledarc ($ handle, 50, $ i, 100, 50, 0, 90, $ darkred, IMG_ARC_PIE); imagefilledarc ($ handle, 50, $ i, 100, 50, 90, 360, $ darkblue, IMG_ARC_PIE); }

07 07

Membungkus Dasar-dasar

(Romaine / Wikimedia Commons / CC0)> $ handle = ImageCreate (130, 50) atau mati ("Tidak Dapat Membuat gambar"); $ bg_color = ImageColorAllocate ($ handle, 255, 0, 0); $ txt_color = ImageColorAllocate ($ handle, 0, 0, 0); ImageString ($ handle, 5, 5, 18, "PHP.About.com", $ txt_color); ImageGif ($ pegangan); ?>

Sejauh ini semua gambar yang kami buat telah format PNG. Di atas, kami membuat GIF menggunakan fungsi ImageGif () . Kami juga mengubah adalah header yang sesuai. Anda juga dapat menggunakan ImageJpeg () untuk membuat JPG, asalkan header berubah untuk mencerminkan dengan tepat.