Wyższa Szkoła Gospodarki w Bydgoszczy
Instytut Informatyki Stosowanej
Technologie internetowe (2006/2007)

Ćwiczenie 4.

Generowanie grafiki przez serwer WWW.

1. Cel ćwiczenia

Celem ćwiczenia jest przedstawienie możliwości języka PHP w zakresie dynamicznego
generowania grafiki, a także jej obróbki. Ćwiczenie wymaga znajomości podstaw języka HTML
oraz składni języka PHP (instrukcje warunkowe, formatujące itp.).


2. Wprowadzenie

PHP zawiera możliwość generowania grafiki „w locie”, a także wczytanie i modyfikowanie
istniejącego pliku graficznego (dzięki wykorzystaniu biblioteki GD – www.boutell.com/gd/).
Funkcjonalność w postaci funkcji rysujących proste figury geometryczne pozwala na dynamiczne
tworzenie zestawień, wykresów i statystyk na podstawie danych przechowywanych w plikach
tekstowych lub bazach danych.


Ćwiczenie 1.

Za pomocą funkcji GetImageSize() możemy uzyskać informacje o danym pliku graficznym.
Informacje zwracane są w postaci czteroelementowej tablicy:

$tabl = getimagesize("image.gif");

echo $tabl[0]." ".$tabl[1]." ".$tabl[2]." ".$tabl[3];

Co zwracają poszczególne elementy tablicy (przetestuj dla plików graficznych o różnych rozszerzeniach)?

Ćwiczenie 2.

Wykonaj poniższy skrypt:

<?

$wysokosc = 200;

$szerokosc = 200;

$graph = ImageCreate($szerokosc, $wysokosc);

$bialy = ImageColorAllocate($graph,255,255,255);

$czarny = ImageColorAllocate($graph,0,0,0);

ImageFill($graph,0,0,$czarny);

ImageLine($graph,0,0,$szerokosc,$wysokosc,$bialy);

ImageString($graph,1,50,150,"Sprzedaż",$bialy);

Header("Content-type: image/png");

ImagePng($graph);

ImageDestroy($graph);

?>

Wyższa Szkoła Gospodarki w Bydgoszczy
Instytut Informatyki Stosowanej
Technologie internetowe (2006/2007)

Ćwiczenie rozpoczyna się utworzeniem identyfikatora dla nowo tworzonego obrazu. Można to
uczynić poprzez stworzenie nowego, pustego kadru - ImageCreate(), lub poprzez wczytanie
istniejącego obrazu, który będzie podlegał modyfikacji - ImageCreateFromPNG(),
ImageCreateFromJPEG(), ImageCreateFromGIF().

Aby użyć kolorów w obrazie należy je wcześniej zadeklarować - ImageColorAllocate() - poprzez
wskazanie składowych barw koloru (RGB).

Funkcja ImageFill() wypełnia podanym kolorem kadr obrazka. Pobiera jako parametry
identyfikator obrazka, początkowe współrzędne obszaru rysowania (x,y) oraz kolor wypełnienia.

Funkcja ImageLine() rysuje linię pobierając identyfikator obrazu, współrzędne początkowe i
końcowe oraz kolor.

Aby w kadrze obrazu umieścić tekst należy skorzystać z funkcji ImageString(). Pierwszy parametr
jest identyfikatorem obrazu, drugi określa wielkość czcionki, dwa kolejne to współrzędne początku
tekstu, w cudzysłowiu przekazuje się właściwy tekst, natomiast ostatni parametr to kolor tekstu.

Proces wyświetlania grafiki jest dwustopniowy: najpierw należy przekazać przeglądarce
informację, że zostanie wyświetlony obraz, a nie tekst lub kod HTML - funkcja Header() pozwala
określić typ obrazka w kodzie MIME.

Po przesłaniu informacji o nagłówku należy wyświetlić obrazek - ImagePng(), a następnie zwolnić
zasoby - ImageDestroy().


Ćwiczenie 3.

Zmodyfikuj powyższy skrypt, aby wyświetlić wewnątrz kadru (kolor biały) kwadrat o czarnych
konturach (także biały kolor wypełnienia).

ImageRectangle($graph,10,10,100,100,$czarny);

ImageFilledRectangle($graph,11,11,98,98,$bialy);

Ćwiczenie 4.

Zmodyfikuj powyższy skrypt, aby wyświetlić czarną ramkę (o szerokości 1 pixela) wokół kadru.
W tak stworzonym kadrze narysuj elipsę/okrąg i jego/jej wycinek:

ImageArc($graph,$srodek_x,$srodek_y,$szer,$wysokosc,$poczatek,$koniec,$kolor);

Ćwiczenie 5.

Stwórz ankietę internetową. W tym celu w pliku index.html umieść formularz, w skład którego
wchodzić będą trzy komponenty typu RADIO (trzy opcje do wyboru, tematyka dowolna) oraz
przycisk. W wyniku naciśnięcia przycisku uruchomi się skrypt show.php, który wyświetli kadr
zawierający trzy słupki reprezentujące wyniki ankiety wraz z liczbą oddanych głosów na każdego z
kandydatów. Dodatkowo należy stworzyć trzy pliki tekstowe (dla każdego z opcji) zawierające
liczbę aktualnie oddanych na danego kandydata głosów.

Wyższa Szkoła Gospodarki w Bydgoszczy
Instytut Informatyki Stosowanej
Technologie internetowe (2006/2007)

Skrypt show.php powinien zatem otworzyć plik tekstowy wybranej opcji, pobrać z niego liczbę,
zwiększyć ja o 1 i zapisać w tym samym pliku (zapis i odczyt z pliku opisany jest w ćwiczeniu
laboratoryjnym nr 2).
W drugiej części skrypt powinien pobrać liczby z trzech plików tekstowych, podstawić pod
zmienne i w kadrze obrazu narysować trzy słupki o wysokościach proporcjonalnych do tych
wartości.

Alternatywnym sposobem jest zastosowanie tabeli w bazie MySQL do przechowywania oddanych
głosów.


6. Wnioski i spostrzeżenia


7. Literatura

[1] Welling L., Thomson L., PHP i MySQL. Tworzenie stron WWW, HELION, Gliwice 2002,
[2] Lerdorf

R.,

PHP4. Leksykon kieszonkowy, HELION, Gliwice 2003,

[3] Ford

A.,

Apache. Leksykon kieszonkowy, HELION, Gliwice 2000,

[4] www.php.net,