SVG nədir?

SVG (Skalajlana vektorli qrafika) — XML asosida yaratilgan ikki o‘lchovli grafikalarni yaratish uchun mo‘ljallangan vektor grafik formatidir. Raster tasvirlardan farqli o‘laroq, SVG grafikani matematik formulalar yordamida tasvirlaydi, bu esa tasvirlarni sifat yo‘qotmasdan kattalashtirish imkonini beradi.

SVG ning asosiy xususiyatlari:

• Vektor format: Tasvirlar geometrik primitivalar (nuqtalar, chiziqlar, egri chiziqlar, shakllar) yordamida tasvirlanadi, piksellar yordamida emas.
• XML asosida: SVG hujjatining tuzilishi XML sintaksisiga asoslangan, bu uni oson o‘qish va tahrirlash imkonini beradi.
• Kattalashtirish imkoniyati: Tasvirlarni kattalashtirish yoki kichiklashtirish mumkin, sifat yoki aniqlikdan voz kechmasdan.
• Interaktivlik: SVG elementlari interaktiv bo‘lishi mumkin, JavaScript yordamida voqealarga (bosish, ustiga olib borish va h.k.) javob berishi mumkin.
• Stil berish: SVG elementlarining tashqi ko‘rinishi CSS yordamida sozlanishi mumkin.
• Animatsiya: SVG elementlarining animatsiyasi ichki vositalar yoki CSS/JavaScript yordamida qo‘llab-quvvatlanadi.

Vebda SVG foydalanishning afzalliklari:

• Ikonalar va logotiplar uchun ideal: Kattalashtirish har qanday ekran rezolyutsiyasida aniq ko‘rinishni ta’minlaydi.
• Fayl hajmi kichikroq: Ko‘p grafik turlari uchun SVG fayllari, benzer raster formatlaridan kichik bo‘lishi mumkin.
• SEO uchun mos: SVG ichidagi matn qidiruv tizimlari tomonidan indekslanadi.
• Kirish imkoniyati: Matn tabanli bo‘lgani uchun, SVG yordamchi texnologiyalar uchun yanada kirish mumkin.
• Oson o‘zgartirish: XML bo‘lgani uchun, uning mazmuni dinamik tarzda o‘zgartirilishi mumkin.

Oddiy SVG tasvir misoli (aylana):

<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>