SVG (од англ. Scalable Vector Graphics = „размерлива векторска графка“) е дводимензионална векторска графика на основа на XML со поддршка за интерактивности и анимации. Таа е отворен стандард што го изготвува Конзорциумот за Светската пајажина (W3C) почнувајќи од 1999 г.
 | |
| Наставка | .svg, .svgz |
|---|---|
| MIME-тип | image/svg+xml[1][2] |
| UTI | public.svg-image |
| Творец | W3C |
| Прва верзија | 4 септември 2001 |
| Најнова верзија | 1.1 (II изд.) / 16 август 2011 |
| Тип на формат | векторски графички формат |
| Проширен од | XML |
| Отворен формат? | да |
| Мреж. место | w3.org/Graphics/SVG/ |
SVG-сликите и нивното поведение се зададени текстуално во XML-податотеки. Ова значи дека истите можат да се пребаруваат, индексираат, сценираат (со скрипта) и, по потреба, да се збиваат. Како XML-податотеки, сликите во форматот SVG можат да се создаваат и уредуваат со секој уредник на текст, но работата со нив е најзгодна во програми за цртање како Inkscape. Предноста на векторската графика е тоа што на сликите можат да се зголемуваат до бесконечност без никакви промени или загуби.
Денес сите позастапени прелистувачи како Mozilla Firefox, Internet Explorer 9 и 10, Google Chrome, Opera и Safari имаат поддршка за SVG во поголема или помала мера, и можат непосредно да исцртуваат (рендерираат) графички код.
Преглед
Развојот на SVG почнува уште во 1999 г. од група фирми во состав на W3C, откако во 1998 биле поднесени конкурентни стандарди јазик за означување на прецизна графика (PGML, изведен од PostScript на Adobe) и јазикот за векторско означување (VML, од RTF на Microsoft) и искористени се нивните искуства.[3]
SVG допушта три вида на графички објекти: векторска графика, растерска графика, и текст. Графичките објекти, вклучувајќи ги растерските слики од форматите PNG и JPEG, можат да се групираат, стилизираат, вметнуваат/придодаваат во претходно исцртани објекти. SVG не нуди непосредна поддршка за z-индекси[4] што ај двојат редоследот на исцртување од редоследот во документот кај објектите што се преклопуваат, за разлика од некои други векторски графички јазици како VML. Текстот може да биде во било кој XML-именски простор соодветен за намената, кој ја достапноста на SVG-графиката и овозможува пребарливост на текстот. Во овој збир можности спаѓаат и трансформации, патеки за потсек, алфа-маски, филтерски ефекти, шаблонски објекти и менување на големината.
Почнувајќи од 2001 г, уредбата на SVG е надградена на верзија 1.1 (тековната препорака) и верзија 1.2 (сè уште работен нацрт). Препораката наречена SVG Mobile е предвидена со два упростени „профили“ на SVG 1.1, наречени SVG Basic и SVG Tiny, наменети за уреди со ограничени сметачки и приказни можности. SVG Tiny подоцна станал самостојна препорака (тековна верзија е 1.2) и претставува основа за SVG 1 февруари Покрај овие варијанти и профили, постои и уредба SVG Print (сè уште работен нацрт) со насоки за документи во SVG 1.2 и SVG Tiny 1.2 наменети за печатарството.
Печатење
Иако главна задршка на уредбата во SVG е означниот јазик за векторска графика, во него се предвидени основни можности за јазик за опис на страница (PDL), како што е PDF на Adobe. Подготвен е со можност за богата графика и складност со каскадни стилски страници (CSS) за стилски цели. Така, тој се разликува од XHTML, чија главна цел е општење на содржини, а не ликовно претставување и укажува кои објекти треба да се прикажа, но не и каде треба да стојат. Наспроти тоа, SVG е идеален за употреба во печатарството, бидејќи ги содржи сите функции што го ставаат секој глиф и секоја слика на саканото место во конечниот изглед на страницата.[5] Во најново време се изготвува многу поспецијализиран вид на SVG, наречен „SVG Print“ на кого работат Canon, HP, Adobe и Corel) и засега е во облик на работна нацрт-верзија.[6]
Сценирање и анимација
Цртежите во SVG можат да бидат динамични и интерактивни. Видоизмените на графиката во однос на времетраењето се задаваат јазикот SMIL, или пак можат да се испрограмираат во сценариски (скриптен) јазик (како на пр. ECMAScript или JavaScript). W3C го препорачува SMIL како претпочитан стандард за анимирање во SVG.[7] На секој графички објект може да му се зададе богата палета на активности како оние поттикнати од доведување на глушецот врз објектот (onmouseover) и негово стискање (onclick).
Збивање
Бидејќи се во XML, SVG-сликите содржат многу повторливи делови текст, па затоа се мошне погодни за алгоритми за беззагубно збивање (компресија). Кога една SVG-слика ќе се набие со соодветниот алгоритам gzip, тогаш се нарекува „SVGZ“-слика и ја има наставката .svgz. Сите места што прикажуваат слики од SVG 1.1, воедно прикажуваат и набиени слики.[8] Една SVGZ-податотека има големина 20-50% од изворната.[9]
Можности
Уредбата SVG 1.1 определува 14 видови можности со свои функции:[10]
- Патеки
- На сликата се исцртуваат прости или сложени (повеќеелементни) обливи со криви или прави линии што можат да се исполнуваат, контурираат или употребат како исечок. Патеките имаат компактно кодирање. На пример M (се однесува на move to, „премести на“) им претходи на првичните бројчени координати x и y , а L (line to, „линија кон“) ѝ претходи на точката до која ќе се протега линијата што треба да се нацрта. Други наредбени букви (C, S, Q, T и A) стојат пред податоците со кои се цртаат разни Безјеови и елиптични криви. Патеката се затвора со Z. Во сите случаи, пред апсолутните координати стојат големите наредеени букви, а пред релативните координати стојат исти такви мали букви.[11]
- Основни облици
- Можат да се цртаат патеки од прави линии и патеки составени од поврзани отсечки, покеај затворените многуаголници, кружници и елипси. Стандардни елементи се и правоаголниците и заоблените правоаголници.[12]
- Текст
- Уникодните знаци што се содржат во една SVG-податотека се изразени како податоци во XML. Можни се многу визуелни ефекти, а уредбата на SVG автоматски работи со двонасочен текст (на пр. за составување на арапски и македонски текст), вертикален текст (како кинескиот во минатото) и текст по закривена патека (како текст околу логоа и амблеми).[13]
- Сликање
- Облиците можат да се насликаат и/или контурираат (со боја, постепено нијансирање или шара). Полнетиците можат да бидат непроѕирни или со извесен степен на проѕирност. На темињата на многуаголниците (т.е. на краевите на линиите) можат да се ставаат „бележници“ како стрелки или симболи.[14]
- Бои
- Боите можат да се применат врз сите видливи SVG-елементи, било непосредно или преку „полнетица“ (fill), „потег“ (stroke) и други својства. Боите се укажуваат на истиот начин како стилските стрници CSS2, т.е. со употреба на називи како
black(црна) илиblue(сина) во шеснаесетеречен облик како#2f0или#22ff00, десетично какоrgb(255,255,127)или пак како постотоци во обликотrgb(100%,100%,50%).[15] - Постепено нијансирање и шари
- Облиците во SVG можат да се исполнуваат и контурираат со полни бои на гореопишаниот начин, но и со постепено нијансирање на боите или со повторливи шари. Постепеното нијансирање на боите може да биде линеарно или кружно (радијално) и може да се врши со било колку бои и повторувања. Може да се укаже и нијансирањето на проѕирноста. Шарите се засноваат на претходно зададени растерски или векторски графички објекти, кои можат да се повторуваат во насока x и/или y. Постепените нијансирања и шарите можат да се анимираат и сценираат.[16]
- Во последно време[17][18] професионалните корисници на SVG се залагаат за додавање на можностите за мрежно нијансирање или, по можност, дифузни криви. Причината е тоа што дури и простата примена на дифузни криви дава дури и најсуптилни ефекти на сенки и сенчење"[19] и дека сликите со дифузни криви се споредливи по квалитет и кодна ефикасност со мрежното нијансирање, но се поедноставни за создавање и дека можат да се добиваат од растерски слики по наполно автоматски пат."[20]
- Исечоци, маскирање и придодавање
- Графичките елементи заедно со текстот, патеките и основните облици (фигури) и нивните комбинации можат да се користат како контури што можат да независно една од друга се сликаат (со бои, постепено нијансирање и шари). Бојата и проѕирноста на секој пиксел од конечната слика можат да се добијат со меѓусебно придодавање и пресметка на непроѕирни патеки за исечоци (clipping paths) и полупроѕирни маски (постапка наречена алфа-мешање.[21]
- Филтерски ефекти[22]
- Интерактивност
- SVG-сликите се интераквитни за корисниците на повеќе начини. Покрај долуспоменатите хиперврски, сите делови од една SVG-слика можат да се направат чувствителни на потези на корисникот како сосредоточување (истакнување), стисоци со глушецот, лизгање по сликата, нејзино приближување/одделечување и други постапки со стрелка, тастатура и документот. Програмот може да ја пушта, запира и менува анимацијата, како и да повикува сценарија како одговор на тие настани.[23]
- Врски
- Сликите можат да содржат хиперврски до други документи, користејќи го XLink. URL-адресите на сликите можат да укажуваат геометриски трансформации во делот за извадоци.[24]
- Сценирање
- Сите аспекти на еден SVG-документ можат да се менуваата со сценирање (скрпти) слично како што тоа се прави во HTML. Основно зададениот сценариски јазик е ECMAScript (во блиско сродство со JavaScript) и затоа постојат зададени DOM-објекти за секој SVG-елемент и атрибут. Сценаријата се заградуваат со елементите
<script>(т.е. се ставаат на почетокот и на крајот). Тие можат да работат како одговор на нешто направено со стрелката на глушецот, тастатурата или со документот како таков.[25] - Анимирање
- Содржините во SVG можат да се анимираат со вградени елементи како
<animate>,<animateMotion>и<animateColor>. Ова може да се прави со менување на DOM користејќи ECMAScript и со вградените времебројачи на сценарискиот јазик. Анимирањето во SVG е предвидено за да биде складно со тековната и идните верзии на SMIL. Анимациите можат да бидат непрекинати, можат да се повторуваат (целите одново или нивни делови) и да реагираат на нешто активност од страна на корисникот според гореспоменатото.[26] - Фонтови
- Како и кај HTML и CSS, текстот во SVG може да се повикува на надворешни фонтовски податотеки, како што се системските фонтови. Ако бараните фонтови не постојат на сметачот кајшто се отвора сликата, текстот може да не се испише како што треба. За да се избегне ова, текстот може да се прикаже во „SVG-фонт“, каде бараните глифови се задаваат во SVG како фонт кој потоа се повикува од елементот
<text>.[27] - Метаподатоци
- Во согласност со иницијативата Семантичка пајажина на W3C, корисникот има можност за ставање на метаподатоци за содржината на секоја SVG-слика. Ова се прави преку елементот
<metadata>, каде документот се опишува со метаподаточни својства во Dublin Core (на пр. наслов, творец/автор, предметна определница, опис итн). Можат да се користат и други метаподаточни шеми. Покрај сево ова, во SVG се зададени и елементи<title>и<desc>, каде авторите можат да внесат описен материјал за сликата во прост текст за да за да се овозможи индексирање, пребарување и добивање на различни начини.[28]
Еден SVG-документ може да дава определби на составните делови како облици, постепено нијансирање итн и да ги користи на повторлив начин. Секоја SVG-слика може да содржи и растерска графика како слики во форматите PNG и JPEG, како и други SVG-слики.
Поврзано
Наводи
Надворешни врски
Wikiwand in your browser!
Seamless Wikipedia browsing. On steroids.
Every time you click a link to Wikipedia, Wiktionary or Wikiquote in your browser's search results, it will show the modern Wikiwand interface.
Wikiwand extension is a five stars, simple, with minimum permission required to keep your browsing private, safe and transparent.
