Narzędzie: SVG - Scalable Vector Graphics
Kategoria: grafika komputerowa
Temat: O grafice SVG
Poziom trudności: 2/3
Wielkość dokumentu: ok. 2200 znaków, 2 ilustracje
Kategoria: grafika komputerowa
Temat: O grafice SVG
Poziom trudności: 2/3
Wielkość dokumentu: ok. 2200 znaków, 2 ilustracje
A wyobraźmy sobie inne rozwiązanie, które w wielu sytuacjach może się okazać znacznie prostsze i wygodniejsze, choć naturalnie nie jest wcale uniwersalne i do zastosowania w każdych okolicznościach. Rozwiązaniem tym jest grafika SVG.
Obraz w formacie SVG jest obrazem zbudowanym z poleceń zapisanych w postaci tekstu, analogicznych do języka HTML czy CSS - przeglądarka z wbudowanym interpreterem SVG czyta taki kod źródłowy i wyświetla odpowiedni obraz. Wszystkie główne przeglądarki wspierają naturalnie SVG. Przykładowy kod:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="150"> <circle cx="100" cy="80" r="50" stroke="red" stroke-width="3" fill="blue" /> </svg>
Kod ten wygeneruje koło z pierwszego przykładu.
Zmieniamy teraz szybko r=50 na r=100, stroke="red" na stroke="blue", a fill="blue" na fill="red" i uzyskujemy takie koło:
Jak widzimy, kilka drobnych zmian w kodzie koła zmieniło radykalnie jego postać. Za każdym razem, gdy będziemy chcieli zmienić promień, kolory wnętrza i obramowania, grubość obramowania czy położenie środka koła, możemy to zrobić błyskawicznie za pomocą drobnej manipulacji w kodzie źródłowym koła. Krótko mówiąc, to my podajemy rozkaz, a przeglądarka posłusznie maluje zgodny z nim obraz. Nietrudno się domyślić, że technika ta ma w sobie ogromny potencjał, a zwykły użytkownik może ją wykorzystać choćby w blogu, jeśli tylko nadarzy się taka okazja. To tylko krótki wstęp do SVG, na zachętę - w innych wpisach przedstawimy praktyczne techniki tworzenia takiej grafiki.
Przydatne info ;) laptopy naprawa Pozdrawia :)
OdpowiedzUsuń