SVG-də Viewbox xüsusiyyətini anlamaq

'SVG' görünüş qutusunu (HTML) istifadə etmək üçün Web Design Guide

Viewbox SVG şəkillərini yaradan zaman tez-tez istifadə olunan bir xüsusiyyətdir. Sənədin bir kətan kimi düşünsəniz, görünüş qutusu görüntüləyənin görməsini istəsəniz, kətanın bir hissəsidir. Səhifə bütün kompüter ekranını əhatə edə bilər, baxmayaraq ki rəqəm rəqəmin yalnız üçdə birində mövcud ola bilər.

Viewbox, parserin üçüncü hissədə böyüməsini izah etməyə imkan verir. Əlavə ağ məkanı aradan qaldırır. Görünüş qutusunu bir şəkil çıxarmaq üçün virtual yanaşma kimi düşünün.

Olmadan, sizin qrafikiniz əsl ölçüsündən üçdə birdir.

Viewbox dəyərləri

Bir görüntüyü kəsmək üçün, şəkil çəkmək üçün şəkil üzərində nöqtələr yaratmalısınız. Görünüş qutusu atributundan istifadə edərkən eyni. Görünüş qutusunun dəyər parametrlərinə aşağıdakılar daxildir:

Görünüş qutusu dəyərləri üçün sintaksis:

viewBox = "0 0 200 150"

Görünüş qutusunun genişliyi və hündürlüyü SVG sənəd üçün təyin etdiyiniz genişlik və hündürlüklə qarışdırmayın. Bir SVG faylını yaratdığınızda, qurduğunuz ilk dəyərlərdən biri sənəd eni və boyudur. Sənəd bir kətandır. Görünüş qutusu bütün kətanı və ya yalnız bir hissəsini əhatə edə bilər.

Bu görünüş qutusu bütün səhifəni əhatə edir.

Bu görünüş qutusu yuxarı sağ küncdən başlayan yarım səhifəni əhatə edir.

Sizin forma həmçinin yüksəklik və genişlik tapşırıqlarına malikdir.


Üstün sağ küncündə başlayan və səhifənin yarısını genişləndirən bir görünüş qutusu ilə 800 x 400 px əhatə edən sənəddir. Forma görünüş qutusunun yuxarı sağ küncündə başlayan və 100 px sola və 50 px aşağı hərəkət edən düzbucaqlıdır.

Niyə bir Viewbox qurmaq?

SVG bir forma çəkməkdən daha çox şey edir. Bir kölgə təsiri üçün digərinin üstündə bir rəqəm yarada bilər. Bu, bir istiqamətə çevrilmək üçün bir forma çevirə bilər. Ətraflı filtreler üçün, görünüş qutusu atributunu anlamaq və istifadə etmək lazımdır.