Elementarz grafiki komputerowej

Grafika wektorowa

Idea wektorowego zapisu grafiki

Rysunek zapisany wektorowo jest przechowywany jako zespół standardowych elementów, takich jak linie (proste bądź krzywe), obszary, napisy, znaczniki itp. Obraz przedstawiany na urządzeniu (monitor, drukarka, ploter) jest „kreślony” element po elemencie. Każdy element obrazu jest opisany za pomocą pewnej liczby cech (atrybutów), których wartości można zmieniać podczas edycji. Cechy — ich nazwy, właściwości i zasady edycji — zależą od środowiska, w którym powstaje rysunek. Poszczególne elementy rysunku mogą się wzajemnie przesłaniać lub przenikać.

Poniższe przykłady przedstawiają zapis wektorowy dwóch prostych rysunków dokonany w pewnym fikcyjnym języku.

rozmiar (-100, -100, 100, 100) kolor (czarny) okrąg (0, 0, 50) półokrąg górny (25, 0, 25) półokrąg dolny (-25, 0, 25) wypełnij obszar (0, -25)

rozmiar (-100, -100, 100, 100) kolor (czarny) linia (-40, 0, -1, 0) linia (1, 0, 40, 0) linia (0, -40, 0, -1) strzałka (0, 1, 0, 40) napis (0, 42, "Północ") napis (0, -42, "Południe") napis (-40, 2, "Zachód") napis (40, 2, "Wschód") kolor (czerwony) okrąg (0, 0, 8) koło (0, 0, 5) napis (10, 4, "Tu jestem")

Pewne elementy tych rysunków mają być nakreślone kolorem czerwonym, a inne czarnym. W drugim rysunku część czarnych linii będzie zasłonięta czerwonym kołem, ale niewidoczne fragmenty są obecne w zapisie wektorowym. Ewentualne usunięcie lub przesunięcie koła spowoduje ich uwidocznienie. Rysunek ma być nakreślony w „bieżącym układzie współrzędnych”, przy użyciu pisma „bieżącego” rozmiaru i kroju, liniami „bieżącej” grubości. Wymagania co do brakujących cech można dodatkowo sprecyzować.

Niezależnie od przyjętej długości jednostki (np. milimetr, cal, stopa, jard, metr, kilometr, mila) rysunek wektorowy jest zdefiniowany równie dobrze. Natomiast można się spodziewać, że jakość nakreślonego obrazu będzie zależeć od relacji między żądaną wielkością rysunku a cechami urządzenia graficznego (takimi jak np. wielkość piksela ekranu bądź wydruku cyfrowego, albo rozmiaru plamki barwnika na papierze).

Typowe zastosowania grafiki wektorowej to wszelkiego rodzaju wykresy i rysunki techniczne, prezentacja danych i modelowanie. Zapis wektorowy jest odpowiedni także dla gotowych dokumentów (niekoniecznie rysunków, ale również tekstów sformatowanych) nie przeznaczonych do dalszej edycji, tylko do rozpowszechniania w gotowej zamkniętej postaci.

Przykłady formatów wektorowych

„Dyżurny” przykład, który rozpoczął nasze rozważania o rysunkach wektorowych, został sformułowany w fikcyjnym języku, lecz prawdziwe języki opisu rysunku rzeczywiście istnieją. Zajmiemy się teraz krótką prezentacją popularnych formatów wektorowych. W ćwiczeniach praktycznych posłużymy się także innymi przykładami prostych rysunków.

SVG

Ważnym formatem zapisu wektorowego jest język SVG (Scalable Vector Graphics). Zaprojektowany w roku 2000 z myślą o bezpośrednim umieszczaniu rysunków w dokumentach internetowych, okazał się wygodną platformą do wymiany informacji graficznej między różnymi środowiskami. Rzut oka na próbkę SVG (przykłady znajdują się niżej w tabeli) pozwala stwierdzić, że dane zapisywane są znakowo w pewnym języku. Odpowiedni program graficzny na podstawie tych poleceń zbuduje obrazek, taki jak zawartość okien aplikacji na ilustracji przedstawionej obok poleceń (pierwszy z przykładów pochodzi z dokumentacji internetowej poświęconej obsłudze formatu SVG przez program Mozilla, drugi jest kontynuacją przykładu dyżurnego). Oprogramowanie umożliwiające interaktywną edycję oraz oglądanie takiej grafiki jest ogólnie dostępne. Jeżeli Twoja przeglądarka potrafi interpretować rysunki SVG, to rezultat będzie można obejrzeć poniżej, pod zrzutami ekranu.

Format wektorowy SVG

Kod źródłowy rysunku SVG
Zrzuty ekranowe edytorów grafiki wektorowej (Inkscape i Corel DRAW) z interpretacją rysunku SVG — oglądasz obrazy rastrowe
Interpretacja rysunku SVG pobranego z osobnego pliku (efekt będzie widoczny tylko w przeglądarkach obsługujących obiekty SVG)
Rysunki SVG mogą być umieszczane także bezpośrednio w pliku dokumentu. Efekt będzie widoczny tylko w przeglądarkach obsługujących bezpośrednie znakowanie SVG i tylko w odpowiednio przygotowanych dokumentach. Bieżący dokument ma nowocześniejszą wersję, w której jest to możliwe.

PostScript i PDF

Format PostScript będzie się pojawiał wielokrotnie w tym opracowaniu. Jest to stworzony w 1984 r. przez firmę Adobe Inc. język wektorowego opisu wydruku, rozumiany bezpośrednio przez wysokiej klasy drukarki. Chociaż budowa plików PostScript jest skomplikowana, to widać z niej, że obejmuje ona polecenia kreślenia wydruku element po elemencie. PostScript może być uważany za jeden z formatów przechowywania rysunków wektorowych.

Zapis w postaci plików PostScript jest odpowiedni zwłaszcza dla gotowych dokumentów nie przeznaczonych do dalszej edycji, na etapie pomiędzy edycją a wydrukiem lub do rozpowszechniania w formie elektronicznej. Do tego samego celu służy opracowany w roku 1990 pokrewny format PDF (Portable Document Format). Oba przedstawiamy w poniższym przykładzie.

Wydruk PostScript	Dokument PDF

W ten sposób udostępnia się np. gotowe artykuły, raporty i dokumentację w Internecie.

MetaPost

Język grafiki wektorowej o nazwie MetaPost, opracowany w roku 1990, jest blisko związany ze standardem PostScript i środowiskiem wydawców literatury technicznej. Pierwowzorem pierwszego z przedstawionych niżej przykładów jest rysunek 21. z dokumentacji języka MetaPost; jest on zbliżony do pierwszego z przykładów dyżurnych. Przykład drugi jest kontynuacją drugiego przykładu dyżurnego.

Formaty wektorowe MetaPost i PostScript

Kod źródłowy rysunku MetaPost
Plik PostScript wygenerowany z rysunku MetaPost
Efekt interpretacji pliku PostScript przez program GhostView — oglądasz obraz rastrowy

Rysunki MetaPost zazwyczaj tworzy się korzystając z interaktywnych programów graficznych, choć można również tworzyć samemu plik z poleceniami. Podstawowym sposobem wykorzystania MetaPosta jest generowanie rysunków w formacie PostScript.

Flash

Format Flash został opracowany w 1996 r. przez firmę Macromedia. Obecnie jest ona częścią korporacji Adobe.

W plikach formatu wektorowego Flash da się umieszczać zarówno rysunki, jak i bogatą zawartość multimedialną oraz elementy interaktywne. Dlatego pliki Flash bardzo często są wykorzystywane w grafice użytkowej (np. nauczanie, reklamy).

Flash, podobnie jak PDF, jest formatem binarnym. Podobnie jak PDF i PostScript, jest to format prezentacyjny, przeznaczony dla końcowego odbiorcy.

VRML

Opracowany w 1995 r. język grafiki wektorowej znany jako VRML (Virtual Reality Modeling Language, mimo nazwy zakończonej literami ML nie wywodzi się z języka SGML). Służy on, jak wskazuje jego nazwa, do modelowania i opisu obiektów trójwymiarowych. Nadaje się doskonale do opisywania nawet bardzo skomplikowanych układów wielu obiektów. Odpowiednie oprogramowanie pozwala na ich wizualizację z różnych miejsc, uwzględniając perspektywę, wzajemne przesłanianie, oświetlenie i ewentualny ruch. Załączony przykład przedstawia ośmiościan foremny.

Format wektorowy VRML

Rysunek VRML	Obraz rastrowy wygenerowany z rysunku VRML przez program graficzny (GeomView, Centrum Geometrii Uniwersytetu Minnesota)

DXF

Język opisu grafiki znany jako DXF (Drawing Interchange Format), opracowany przez firmę Autodesk w końcu lat osiemdziesiątych XX wieku, służy do wymiany danych graficznych między systemami komputerowego wspomagania projektowania (CAD) a innymi środowiskami. Wiele współczesnych użytkowych programów graficznych posiada moduły importu i eksportu rysunków DXF. Do tworzenia grafiki w tym formacie można też wykorzystać liczne biblioteki graficzne zintegrowane np. z oprogramowaniem obliczeniowym i z językami programowania ogólnego przeznaczenia. Przygotowanie plików DXF bezpośrednio przez użytkownika jest również możliwe, choć kłopotliwe z uwagi na cyfrowe oznaczenia atrybutów oraz na stopień komplikacji typowego rysunku technicznego.

Na załączonym przykładzie przedstawiony jest sześcian.

Format wektorowy DXF

Kod źródłowy rysunku DXF (przykład pochodzi od Johna Burkardta)	Obraz rastrowy wygenerowany z rysunku DXF przez program graficzny Blender

Tworzenie i edycja grafiki wektorowej

Grafika wektorowa znajduje zastosowanie w wielu dziedzinach działalności, m.in. przy tworzeniu rysunków technicznych (CAD), w grafice prezentacyjnej (diagramy, wykresy, wizualizacje, modelowanie przestrzenne), w typografii (opis fontu, opis strony wydruku), w twórczości artystycznej (niektóre techniki animacji).

Niezależnie od narzędzia stosowanego podczas edycji i od formatu zapisu rysunku, centralnym pojęciem związanym z rysunkiem jest układ współrzędnych. Służy on do opisywania położenia, rozmiarów i kształtów obiektów składających się na rysunek.

Elementy rysunku są opisywane na zasadzie „jak się je konstruuje”. Tym rysunki wektorowe różnią się od obrazów rastrowych, w których opis nakierowany jest na to, „jak obraz ma wyglądać”.

Katalog podstawowych obiektów używanych w grafice wektorowej obejmuje m.in. (część rysunków pochodzi z dokumentacji technicznej formatu SVG):

Punkty

opisywane za pomocą współrzędnych w układzie kartezjańskim, biegunowym lub innym. Punkt jako taki nie ma wymiarów liniowych, dlatego do jego wizualizacji zawsze używa się jakiegoś umownego znacznika (markera)

Odcinki linii prostych

opisywane za pomocą współrzędnych punktów: początkowego i końcowego

Linie łamane

opisywane za pomocą współrzędnych ciągu wierzchołków

Prostokąty

opisywane za pomocą położenia jednego wierzchołka, szerokości i wysokości

Wielokąty

opisują obszary ograniczone dowolną linią łamaną zamkniętą

Linie krzywe gładkie i z załamaniami w węzłach

opisywane za pomocą punktów węzłowych, przez które linia przechodzi, oraz punktów kontrolnych nie należących do niej, lecz wpływających na jej kształt. Do nakreślenia linii służą równania algebraiczne, których współczynniki zależą od współrzędnych punktów węzłowych i kontrolnych. Najważniejszymi typami linii stosowanymi w grafice wektorowej są:

• krzywe sklejane Béziera 2. stopnia;
• krzywe sklejane Béziera 3. stopnia;
• krzywe sklejane wielomianowe 3. stopnia;
• a w grafice trójwymiarowej — także krzywe wymierne

Obszary krzywoliniowe

opisują obszary ograniczone linią krzywą zamkniętą

Łuki okręgów i elips oraz wycięte za ich pomocą koła i elipsy

opisywane za pomocą współrzędnych środka i promienia (promieni) oraz zakresu kątów

Sektory i odcinki kół oraz elips

obszary wycięte za pomocą łuku okręgu lub elipsy, odpowiednio zamkniętego

Teksty

treść informacji przechowywana jest jako ciąg znaków; o jego pozycjonowaniu, rozmiarach i innych właściwościach prezentacyjnych decydują dodatkowe atrybuty

Powierzchnie i bryły różnego typu

tylko w grafice trójwymiarowej

Inne obiekty, zależnie od możliwości edytora i formatu rysunku

Obiekty używane w grafice wektorowej są opisywane za pomocą katalogu właściwości. Do podstawowych właściwości prezentacyjnych należą:

Kolor i wzorzec linii lub obramowania

grubość, sposób kreślenia linii

Kolor i wzorzec wypełnienia obiektu

jednolity kolor, gładkie przejście kolorów, wzorzec rastrowy

Kolor i postać znaczników punktów węzłowych

mogą np. być oznaczone kółkiem lub strzałką

Kształt połączeń linii w węzłach

ważne w rysunku technicznym

Właściwości prezentacyjne tekstu

nazwa używanego fontu, odmiana i stopień pisma

Właściwości niegraficzne

np. hipertekstowe

Na obiektach da się wykonywać operacje geometryczne, w szczególności operacje opisywane metodami algebry liniowej. W środowiskach użytkowych na ogół parametry przekształceń algebraicznych da się określić wizualnie (np. przez wskazanie kąta obrotu) lub numerycznie (np. przez podanie wartości liczbowych współczynników macierzy przekształcenia).

Można też tworzyć obiekty na podstawie zawartości innych obiektów, posługując się metodami algebry zbiorów (np. biorąc ich sumę, różnicę, dopełnienie, część wspólną czy też różnicę symetryczną).

Obiekty przestrzenne mogą się wzajemnie przenikać. Podczas prezentacji scen przestrzennych na dwuwymiarowym ekranie obiekty mogą się wzajemnie przesłaniać. W grafikach dwuwymiarowych wzajemne przesłanianie obiektów wynika z kolejności ich rzutowania na płaszczyznę rysunku (tzw. indeks z, czyli z-ordering).

Katalog operacji używanych w grafice wektorowej obejmuje m.in.

Translacje obiektów

Skalowanie obiektów

Obroty wokół dowolnie wybranego punktu

Odbicia symetryczne względem wybranej prostej

Inne przekształcenia opisywane metodami algebry liniowej

w niektórych środowiskach istnieje możliwość jawnego podania macierzy przekształcenia

Składanie przekształceń w ustalonej kolejności

Wybrane przekształcenia nieliniowe

np. rzutowanie perspektywiczne, nakładanie obiektów dwuwymiarowych na dowolne powierzchnie, układanie tekstu wzdłuż linii krzywej

Operacje mnogościowe

tworzenie obiektów drogą zastosowania działań teorii zbiorów do wybranych obiektów

Powielanie obiektów metodami kopiowania i klonowania

kopia jest niezależnym obiektem; klon pozostaje zależny od oryginału i reaguje na jego modyfikacje

Grupowanie obiektów

grupa jest obiektem złożonym traktowanym jako całość, lecz dającym się rozmontować

Scalanie obiektów

efektem scalenia jest pojedynczy obiekt; nie da się go z powrotem rozbić na elementy

Przycinanie obiektów

ustalanie widoczności zależnie od położenia względem innego obiektu

Konwersje obiektów różnych typów

np. zastąpienie napisu linią obrysowującą znaki fontu

W skrajnym przypadku zapis wektorowy obrazu może zawierać wyłącznie polecenia dotyczące barwy poszczególnych pojedynczych punktów interpretowanych jako piksele; zapis taki jest praktycznie równoważny zapisowi rastrowemu.

Metodami grafiki wektorowej posługuje się wiele grup oprogramowania użytkowego, między innymi:

• oprogramowanie do wizualizacji danych (pakiety statystyczne, arkusze kalkulacyjne, programy do kreślenia wykresów),
• programy interaktywne do tworzenia grafiki wektorowej (np. Corel DRAW!, Inkscape, OpenOffice Draw),
• graficzne środowiska wspomagania projektowania (CAD),
• systemy modelowania rzeczywistości wirtualnej (virtual reality),
• wydruki elektroniczne do plików w formatach PostScript i PDF.

Formaty użytkowe zapisu grafiki wektorowej — podsumowanie

Formaty publicznie dostępne i przenośne

cgm

Computer Graphics Metafile, obiekty dwuwymiarowe

dxf

Data Exchange Format, stosowany w rysunku technicznym CAD dwu- i trójwymiarowym

gml

GIS, obiekty trójwymiarowe

fig

XFig, obiekty dwuwymiarowe

mp

MetaPost, język do tworzenia rysunków technicznych w formacie PostScript

odg

OpenDocument Graphics, w istocie jest to xml/svg skompresowany algorytmem zip

ps

Adobe PostScript, wektorowy opis wydruku dokumentu strona po stronie

svg

Scalable Vector Graphics, język znaczników do opisu dwuwymiarowych obiektów graficznych; jest obsługiwany przez wiele edytorów grafiki i przez przeglądarki internetowe

wrl

Virtual Reality Modeling Language (VRML), prezentacja scen i danych trójwymiarowych

Przykładowe formaty robocze poszczególnych aplikacji użytkowych

cdr

Corel DRAW!

dgn

CAD (Bentley)

dwg

CAD (AutoDesk)

sda

Sun StarDraw

sxd

OpenOffice Draw

swf

format prezentacyjny grafiki Flash

wmf

format wymiany grafiki w systemach Windows

Konwersje obiektów graficznych

Digitalizacja

Operacja polegająca na przekształceniu rysunku wektorowego w obraz rastrowy nosi nazwę digitalizacji. Jest to operacja nieodwracalna. Jej koncepcja jest stosunkowo prosta:

1. nałóż regularną siatkę kwadratów na rysunek;
2. zamaluj każdy kwadrat dominującym kolorem;
3. zapomnij o oryginalnym rysunku, zamiast niego pamiętaj obraz tablicy pikseli odpowiadających poszczególnym kwadratom.

Każde środowisko graficzne musi budować obrazy rastrowe do przedstawiania rysunków na urządzeniach cyfrowych, takich jak monitor i drukarka (przykładem urządzenia, które nie potrzebuje takiej konwersji, jest ploter). Formaty wektorowe mogą służyć do wygenerowania obrazów rastrowych w mniejszej lub większej rozdzielczości. W przeciwieństwie do rysunków wektorowych będących ich pierwowzorem, obrazy te nie będą się już dały dowolnie skalować. Zastąpienie pierwotnego rysunku wektorowego otrzymanym z niego obrazem rastrowym uniemożliwia wykonanie wielu operacji edycyjnych (np. skalowania bez utraty jakości obrazu, aktualizacji przebiegu krzywych i treści napisów).

Obrazy rastrowe otrzymane z rysunku wektorowego

Pliki xpm (niska rozdzielczość)
Pliki xpm (wyższa rozdzielczość)
Obrazy png

Wektoryzacja

Termin wektoryzacja oznacza przekształcenie obrazu rastrowego w rysunek wektorowy. Operacja ta teoretycznie może być odwracalna, choć w praktyce zazwyczaj pożądane jest pominięcie szczegółów obrazu prowadzące do uproszczenia rysunku. Wektoryzacja jest skomplikowanym procesem wymagającym wyrafinowanych algorytmów. Działają one z grubsza według następującej zasady:

1. w układzie barwnych pikseli rozpoznaj przebiegające linie, okręgi, litery i inne znaki, obszary jednobarwne i ich brzegi;
2. zapamiętaj ich parametry. Zapomnij o oryginalnym rysunku.

Istnieje wiele technik wektoryzacji, które znajdują zastosowanie w wyspecjalizowanych obszarach działalności technicznej, np. w kartografii czy też w typografii.

Szczególnym przypadkiem wektoryzacji jest poszukiwanie w treści obrazu elementów o postaci graficznych znaków pisarskich. Ciąg rozpoznanych znaków jest następnie zapisywany w pliku znakowym. Jest to tzw. optyczne rozpoznawanie pisma (optical character recognition, OCR). Programów tego typu używa się zazwyczaj do odtworzenia tekstowej zawartości na podstawie materiałów graficznych pochodzących ze skanowania wydawnictw, maszynopisów lub rękopisów.

Łatwo wyobrazić sobie skrajny przypadek zapisu wektorowego, w którym umieszczono wyłącznie polecenia dotyczące barwy poszczególnych pojedynczych pikseli; zapis taki jest praktycznie równoważny zapisowi rastrowemu i nie wnosi nic nowego.

© Copyright 2001–2009 by Jan Jełowicki, Katedra Matematyki Uniwersytetu Przyrodniczego we Wrocławiu
✉ janj@aqua.up.wroc.pl
⌂ http://karnet.up.wroc.pl/~jasj