Laporan

Membuat Gambar Dengan Format PNG Menggunakan Class GD simple

Disusun

Untuk Memenuhi Tugas Matakuliah Grafika Komputer

Oleh

Saiful Bahri

1108107010063

JURUSAN INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SYIAH KUALA

DARUSSALAM, BANDA ACEH

2014

BAB 1

PENJELASAN TENTANG GAMBAR

1. Penjelasan Gambar

Gambar Pada Tugas ini Dibuat dengan Menggunakan Program Perl Dan Di compile ke

dalam Format PNG,Sedangkan tema pada gambar ini yaitu mengambar logo-logo dan

gambar seperti Android ,Flappy bird ,dll ,pada gambar ini kanvas yang digunakan adalah

1500X1000 pixel dengan jumlah 12 shape atau lebih ,shape tersebut diantaranya berwarna

(transparant) , hijau merah dan kuning,Sedangkan Font Yang digunakan adalah jenis font

Arial dan chiller

2. Tahap-Tahap dalam Membuat gambar

Pertama Membuat Kanvas 1500 x 1000 pixel

Membuat logo hp, flappy bird ,balon udara dengan Ellipse.

Membuat 3 retangle pada logo Adidas dan 2 pada gambar bendera.

Membuat tiang bendera dan logo M I T dengan menggunakan line

Membuat ellipse pada mulut flappy bird

Dan ditambahkan Line pada mulut flappy bird

Line juga ditambahkan diatas kepala android

Mewarnai android dengan Menggunakan Color RGB (87,255,54)

Badan Flappy bird menggunakan Warna (yellow)

Menuliskan Text Pada Kotak rectangle Dengan menggunakan jenis Font Chiller

dan Arial

3. Gambar dapat dilihat pada link berikut : http://cs.unsyiah.ac.id/~sbahri/Grafika/perl.html

BAB II

Code Program

Berikut code program dari gambar tersebut.

#! usr/bin/perl -w

use strict;

use GD::Simple;

my $img = GD::Simple->new(1500, 1000);

# draw a solid orange ellipse

$img->moveTo(110,100);

$img->bgcolor('black');

$img->fgcolor('orange');

$img->ellipse(150,150);

$img->moveTo(50,130);

$img->font('Arial:italic');

$img->fontsize(92);

$img->fgcolor('white');

$img->string('hp');

#bendera

my $poly = new GD::Polygon;

$poly->addPt(200,50);

$poly->addPt(400,50);

$poly->addPt(400,130);

$poly->addPt(200,130);

$img->bgcolor('red');

$img->fgcolor('blue');

$img->penSize(1,1);

$img->polygon($poly);

#putih

my $pol = new GD::Polygon;

$pol->addPt(200,130);

$pol->addPt(400,130);

$pol->addPt(400,210);

$pol->addPt(200,210);

$img->bgcolor('white');

$img->fgcolor('black');

$img->penSize(1,1);

$img->polygon($pol);

#tiang

my $la = new GD::Polygon;

$la->addPt(190,50);

$la->addPt(200,50);

$la->addPt(200,300);

$la->addPt(190,300);

$img->bgcolor('black');

$img->fgcolor('black');

$img->penSize(1,1);

$img->polygon($la);

#Adidas logo 1

my $ful = new GD::Polygon;

$ful->addPt(526,190);

$ful->addPt(567,170);

$ful->addPt(590,200);

$ful->addPt(530,200);

$img->bgcolor('black');

$img->fgcolor('white');

$img->penSize(1,1);

$img->polygon($ful);

#adidas 2

my $ful1 = new GD::Polygon;

$ful1->addPt(570,150);

$ful1->addPt(611,130);

$ful1->addPt(670,200);

$ful1->addPt(610,200);

$img->bgcolor('black');

$img->fgcolor('white');

$img->penSize(1,1);

$img->polygon($ful1);

#adidas3

my $ful2 = new GD::Polygon;

$ful2->addPt(617,110);

$ful2->addPt(660,85);

$ful2->addPt(750,200);

$ful2->addPt(690,200);

$img->bgcolor('black');

$img->fgcolor('white');

$img->penSize(1,1);

$img->polygon($ful2);

#teks adidas

$img->moveTo(540,260);

$img->font('Arial:bold');

$img->fontsize(52);

$img->bgcolor('black');

$img->fgcolor('black');

$img->string('adidas');

#elips

$img->moveTo(200,550);

$img->bgcolor('red');

$img->fgcolor('red');

$img->ellipse(30,100);

#elips

$img->moveTo(400,550);

$img->bgcolor('red');

$img->fgcolor('red');

$img->ellipse(30,100);

#youtube

my $haha = new GD::Polygon;

$haha->addPt(200,500);

$haha->addPt(200,600);

$haha->addPt(400,600);

$haha->addPt(400,500);

$img->bgcolor('red');

$img->fgcolor('red');

$img->penSize(1,1);

$img->polygon($haha);

#teks you

$img->moveTo(13,585);

$img->font('FreeSans:bold');

$img->fontsize(68);

$img->fgcolor('black');

$img->string('You');

#teks tube

$img->moveTo(192,585);

$img->font('FreeSans:bold');

$img->fontsize(68);

$img->fgcolor('white');

$img->string('Tube');

#elips android

$img->moveTo(600,400);

$img->bgcolor(87,255,54);

$img->fgcolor('white');

$img->ellipse(240,240);

#mata

$img->moveTo(550,350);

$img->bgcolor('white');

$img->fgcolor('white');

$img->ellipse(20,20);

$img->moveTo(650,350);

$img->bgcolor('white');

$img->fgcolor('white');

$img->ellipse(20,20);

#elips android

$img->bgcolor('white');

$img->fgcolor('white');

$img->rectangle(471,410,720,500);

#elips android

$img->bgcolor(87,255,54);

$img->fgcolor('white');

$img->rectangle(482,560,720,420);

#tangan android

my $tg1 = new GD::Polygon;

$tg1->addPt(468,445);

$tg1->addPt(468,530);

$tg1->addPt(430,530);

$tg1->addPt(430,445);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->penSize(1,1);

$img->polygon($tg1);

#tangan2 android

my $tg2 = new GD::Polygon;

$tg2->addPt(768,445);

$tg2->addPt(768,530);

$tg2->addPt(730,530);

$tg2->addPt(730,445);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->penSize(1,1);

$img->polygon($tg2);

$img->moveTo(449,440);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->ellipse(38,38);

$img->moveTo(449,530);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->ellipse(38,38);

#bulat tangan

$img->moveTo(749,445);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->ellipse(38,38);

$img->moveTo(749,530);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->ellipse(38,38);

#kaki android

my $tg3 = new GD::Polygon;

$tg3->addPt(668,545);

$tg3->addPt(668,630);

$tg3->addPt(630,630);

$tg3->addPt(630,545);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->penSize(1,1);

$img->polygon($tg3);

#kaki android2

my $tg4 = new GD::Polygon;

$tg4->addPt(568,545);

$tg4->addPt(568,630);

$tg4->addPt(530,630);

$tg4->addPt(530,545);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->penSize(1,1);

$img->polygon($tg4);

#bulat kaki kiri

$img->moveTo(649,635);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->ellipse(38,38);

#bulat kaki kiri

$img->moveTo(549,633);

$img->bgcolor(87,255,54);

$img->fgcolor(87,255,54);

$img->ellipse(38,38);

#line telinga

$img->moveTo(500,280);

$img->fgcolor(87,255,54);

$img->penSize(8);

$img->angle(50);

$img->line(40);

#line telinga2

$img->moveTo(700,280);

$img->fgcolor(87,255,54);

$img->penSize(8);

$img->angle(137);

$img->line(40);

# badan flappy bird

$img->moveTo(210,700);

$img->bgcolor('yellow');

$img->fgcolor('black');

$img->ellipse(150,120);

# mata flappy bird

$img->moveTo(260,690);

$img->bgcolor('white');

$img->fgcolor('black');

$img->ellipse(50,55);

# mulut flappy bird

$img->moveTo(270,730);

$img->bgcolor('red');

$img->fgcolor('black');

$img->ellipse(100,30);

$img->moveTo(275,675);

$img->font('Arial');

$img->fontsize(100);

$img->string('.');

#line mulut

$img->moveTo(314,730);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(180);

$img->line(60);

# Sayap flappy bird

$img->moveTo(150,710);

$img->bgcolor('brown');

$img->fgcolor('black');

$img->ellipse(100,30);

#pipa Flappy bird

my $ful5 = new GD::Polygon;

$ful5->addPt(700,700);

$ful5->addPt(500,700);

$ful5->addPt(500,900);

$ful5->addPt(700,900);

$img->bgcolor(87,255,54);

$img->fgcolor('black');

$img->penSize(5,5);

$img->polygon($ful5);

#pipa Flappy bird

my $pipa = new GD::Polygon;

$pipa->addPt(725,670);

$pipa->addPt(475,670);

$pipa->addPt(475,700);

$pipa->addPt(725,700);

$img->bgcolor(87,255,54);

$img->fgcolor('black');

$img->penSize(5,5);

$img->polygon($pipa);

#pipa Flappy bird

my $pipa1 = new GD::Polygon;

$pipa1->addPt(725,870);

$pipa1->addPt(475,870);

$pipa1->addPt(475,900);

$pipa1->addPt(725,900);

$img->bgcolor(87,255,54);

$img->fgcolor('black');

$img->penSize(5,5);

$img->polygon($pipa1);

#mlc Logo

$img->moveTo(250,880);

$img->bgcolor(0,102,102);

$img->fgcolor(0,102,102);

$img->ellipse(200,200);

#mlc Logo timpa

$img->moveTo(260,870);

$img->bgcolor('white');

$img->fgcolor('white');

$img->ellipse(180,180);

#line diatas logo

$img->moveTo(260,870);

$img->fgcolor(0,102,102);

$img->penSize(5);

$img->angle(137);

$img->line(105);

#mlc Logo timpa

$img->moveTo(260,870);

$img->bgcolor(0,102,102);

$img->fgcolor(0,102,102);

$img->ellipse(25,25);

#line diatas logo

$img->moveTo(260,870);

$img->fgcolor(0,102,102);

$img->penSize(5);

$img->angle(210);

$img->line(96);

#line diatas logo

$img->moveTo(260,870);

$img->fgcolor(0,102,102);

$img->penSize(5);

$img->angle(40);

$img->line(96);

$img->moveTo(125,940);

$img->fgcolor(24,81,128);

$img->angle(0);

$img->font('Arial:bold');

$img->fontsize(90);

$img->string('MLC');

$img->moveTo(100,990);

$img->fgcolor('black');

$img->angle(0);

$img->font('Arial:bold');

$img->fontsize(20);

$img->string('Multimedia Learning Center');

#MIT Logo

$img->moveTo(15,350);

$img->fgcolor(156,0,28);

$img->penSize(20);

$img->angle(90);

$img->line(96);

#Garis2

$img->moveTo(40,350);

$img->fgcolor(156,0,28);

$img->penSize(20);

$img->angle(90);

$img->line(70);

#garis3

$img->moveTo(65,350);

$img->fgcolor(156,0,28);

$img->penSize(20);

$img->angle(90);

$img->line(96);

#Garis4

$img->moveTo(95,380);

$img->fgcolor(145,142,143);

$img->penSize(20);

$img->angle(90);

$img->line(66);

#garis5

$img->moveTo(95,350);

$img->fgcolor(156,0,28);

$img->penSize(20);

$img->angle(90);

$img->line(20);

#garis6

$img->moveTo(125,380);

$img->fgcolor(156,0,28);

$img->penSize(20);

$img->angle(90);

$img->line(66);

#garis terakir

$img->moveTo(115,360);

$img->fgcolor(156,0,28);

$img->penSize(20);

$img->angle(360);

$img->line(40);

#teks

$img->moveTo(0,480);

$img->fgcolor(156,0,28);

$img->angle(0);

$img->font('Arial:bold');

$img->fontsize(15);

$img->string(' Massachusetts Institute of Technology');

#garis terakir

$img->moveTo(785,0);

$img->fgcolor(130,0,28);

$img->penSize(14);

$img->angle(90);

$img->line(1000);

#garis pembatas

$img->moveTo(785,0);

$img->fgcolor('black');

$img->penSize(14);

$img->angle(90);

$img->line(1000);

#background samping biru

$img->bgcolor(180,219,219);

$img->fgcolor(180,219,219);

$img->rectangle(793,1000,1700,0);

#Balon Udara

$img->moveTo(880,140);

$img->penSize(4);

$img->bgcolor(255,178,102);

$img->fgcolor('black');

$img->ellipse(140,220);

#warna point balon

$img->moveTo(910,110);

$img->bgcolor(undef);

$img->fgcolor('yellow');

$img->ellipse(30,30);

#warna point balon

$img->moveTo(850,80);

$img->bgcolor(undef);

$img->fgcolor('green');

$img->ellipse(30,30);

#warna point balon

$img->moveTo(850,170);

$img->bgcolor(undef);

$img->fgcolor('red');

$img->ellipse(30,30);

#garis dibawah balon

$img->moveTo(879,275);

$img->fgcolor(130,0,28);

$img->penSize(40);

$img->angle(90);

$img->line(30);

#garis halus dibawah balon

$img->moveTo(875,248);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(115);

$img->line(30);

#garis halus dibawah balon

$img->moveTo(887,248);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(80);

$img->line(30);

#Balon Udara2

$img->moveTo(1420,140);

$img->bgcolor(255,178,102);

$img->penSize(3);

$img->fgcolor('black');

$img->ellipse(140,220);

#garis dibawah balon

$img->moveTo(1425,270);

$img->fgcolor(130,0,28);

$img->penSize(40);

$img->angle(90);

$img->line(30);

#garis halus dibawah balon

$img->moveTo(1420,247);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(117);

$img->line(26);

#garis halus dibawah balon

$img->moveTo(1437,245);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(78);

$img->line(25);

#warna point balon

$img->moveTo(1437,210);

$img->bgcolor('yellow');

$img->fgcolor('yellow');

$img->ellipse(30,30);

#warna point balon

$img->moveTo(1400,160);

$img->bgcolor('green');

$img->fgcolor('green');

$img->ellipse(30,30);

#warna point balon

$img->moveTo(1440,100);

$img->bgcolor('red');

$img->fgcolor('red');

$img->ellipse(30,30);

#background kotak putih

$img->bgcolor('white');

$img->fgcolor('black');

$img->rectangle(933,700,1380,440);

#garis halus atas kotak

$img->moveTo(930,440);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(360);

$img->line(451);

#garis halus atas kotak

$img->moveTo(930,700);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(360);

$img->line(451);

#garis halus atas kotak

$img->moveTo(930,440);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(250);

$img->line(141);

#garis halus atas kotak

$img->moveTo(1380,440);

$img->fgcolor('black');

$img->penSize(5);

$img->angle(288);

$img->line(145);

#teksreadme

$img->moveTo(980,495);

$img->fgcolor(156,0,28);

$img->angle(0);

$img->font('Eunjin Nakseo');

$img->fontsize(40);

$img->string(' Saiful Bahri');

#teksreadme

$img->moveTo(940,560);

$img->fgcolor(156,0,28);

$img->angle(0);

$img->font('chiller');

$img->fontsize(35);

$img->string(' 1108107010063');

#teksreadme

$img->moveTo(940,620);

$img->fgcolor(156,0,28);

$img->angle(0);

$img->font('Eunjin Nakseo');

$img->fontsize(35);

$img->string(' Grafika Komputer');

#background kotak tanah coklat

$img->bgcolor(158,97,36);

$img->fgcolor(168,97,36);

$img->rectangle(794,950,1510,1000);

#garis halus atas kotak

$img->moveTo(850,950);

$img->fgcolor('Brown');

$img->penSize(20);

$img->angle(270);

$img->line(105);

#garis pohon (batang pohon)

$img->moveTo(858,850);

$img->fgcolor('brown');

$img->penSize(5);

$img->angle(290);

$img->line(55);

#garis pohon (batang pohon)

$img->moveTo(858,850);

$img->fgcolor('brown');

$img->penSize(5);

$img->angle(160);

$img->line(55);

#garis pohon (batang pohon)

$img->moveTo(858,850);

$img->fgcolor('brown');

$img->penSize(5);

$img->angle(360);

$img->line(55);

#garis pohon (batang pohon)

$img->moveTo(850,850);

$img->fgcolor('brown');

$img->penSize(5);

$img->angle(230);

$img->line(55);

#warna daun pohon

$img->moveTo(830,810);

$img->bgcolor('green');

$img->fgcolor('green');

$img->ellipse(50,60);

#warna daun pohon

$img->moveTo(870,810);

$img->bgcolor('green');

$img->fgcolor('green');

$img->ellipse(40,50);

#warna daun pohon

$img->moveTo(810,850);

$img->bgcolor('green');

$img->fgcolor('green');

$img->ellipse(30,50);

#warna daun

$img->moveTo(900,835);

$img->bgcolor('green');

$img->fgcolor('green');

$img->ellipse(40,60);

print $img->png;