SVG-те Viewbox атрибутын қалай түсінуге болады

«SVG» қарау терезесін (HTML) пайдалану үшін веб-дизайн нұсқаулығы

Viewbox - SVG кескіндерін жасау кезінде әдетте пайдаланылатын төлсипат. Құжатты кенеп ретінде қарастырсаңыз, көрініс терезесі көрерменнің көретінін қалайтын кенептің бөлігі. Бет бүкіл компьютер экранын қамтуы мүмкін болса да, суреттің барлығы тек үштен бірінде ғана болуы мүмкін.

Viewbox сіз парсерге сол үшінші көлемді ұлғайтуды айтуға мүмкіндік береді. Ол қосымша ақ кеңістікті жояды. Кескінді бейнелеу үшін виртуальды тәсіл ретінде қарау терезесін ойлап көріңіз.

Онсыз сіздің графигіңіздің нақты өлшемінің үштен бірі пайда болады.

Viewbox құндылықтары

Кескінді қию үшін кескіндерді жасау үшін суреттегі нүктелер жасауыңыз керек. Көрініс терезесінің төлсипатын пайдаланғанда да дәл солай. Көрініс қорына арналған мән параметрлері мыналарды қамтиды:

Көрініс қорап мәндерінің синтаксисі:

viewBox = «0 0 200 150»

Көрініс терезесінің ені мен биіктігі SVG құжаты үшін ені мен биіктігімен шатастырмаңыз. SVG файлын жасаған кезде, сіз орнатқан алғашқы мәндердің бірі құжаттың ені мен биіктігі болып табылады. Құжат кенеп. Көру терезесі бүкіл кенепті немесе оның бір бөлігін ғана қамтуы мүмкін.

Бұл көрініс терезесі бүкіл бетті қамтиды.

Бұл көрініс терезесі жоғарғы оң жақ бұрышта басталатын жарты бетті қамтиды.

Сіздің пішіміңізде де биіктік пен ені тағайындалады.


Бұл жоғарғы оң жақ бұрышта басталатын және беттің жартысын кеңейтетін көру терезесі бар 800х400 пиксельді құжатты қамтитын құжат. Кескіннің жоғарғы оң жақ бұрышында басталатын және 100 пиксельді солға және 50 нүкте төмен жылжытатын тікбұрышты пішін.

Неліктен Viewbox орнату?

SVG пішінді салудан гөрі әлдеқайда көп. Көлеңкелі әсері үшін бірінің үстіне бір сурет жасай алады. Ол пішінді бір бағытта жылжытатын етіп өзгерте алады. Жетілдірілген сүзгілер үшін, көрініс терезесінің төлсипатын түсіну және пайдалану қажет болады.