Маш олон зургийн формат байдаг, гэхдээ тэдгээр нь бүгд растер ба вектор гэсэн хоёр том ангилалд хуваагддаг. Эхнийх нь гэрэл зураг гэх мэт янз бүрийн нарийн төвөгтэй, нарийвчилсан графикуудад ихэвчлэн ашиглагддаг. Тэдгээрийн дотор хамгийн жижиг элемент болох пиксел бүр өөрийн гэсэн өнгөтэй байж болох бөгөөд файл нь ерөнхийдөө зургийн цэг бүрийн өнгийг хадгалдаг. Мэдээжийн хэрэг мэдээллийн хэмжээг шахахын тулд янз бүрийн аргыг ашигладаг бөгөөд үүнээс олон растер форматууд байдаг - bmp, png, jpg болон бусад. Ихэвчлэн jpg нь маш сайн нарийвчлалтай жижиг файл үүсгэдэг тул хамгийн сайн үр ашгийг харуулдаг. Гэхдээ энэ нь сул талтай - мэдээллийг шахах үед мэдээлэл алдагдах. Тиймээс, хэрэв та файлын хэмжээг багасгавал зураг мууддаг.

SVG файлуудтай ажиллах.

Ийм гэрэл зургийг томруулж үзэхэд пикселүүд харагдах болно. Вектор формат нь огт өөр зарчмаар ажилладаг. Тэд математикийн томъёогоор дүрсэлсэн шугам, сегмент, дүрсийг ашигладаг. Тэдгээрээр хязгаарлагдах аливаа орон зайг өнгө эсвэл градиентаар дүүргэж болно. Үр дүн нь тодорхой хэмжээсүүдтэй холбоогүй зураг юм - энэ нь чанарыг алдалгүйгээр асар том хэмжээтэй хүртэл амархан шахаж эсвэл сунгаж болно. Ийм вектор форматын нэг нь SVG юм. Мөн энэ нь ялангуяа вэб хөгжүүлэлтийн орчинд улам бүр түгээмэл болж байна.

Өргөтгөлийн ерөнхий тодорхойлолт

SVG файлын төрөл нь Scalable Vector Graphics буюу өргөтгөх боломжтой вектор графикийн товчлол юм. Зургийг дүрслэхийн тулд VML болон PGML тэмдэглэгээний хэлүүдийг ашигладаг. Үндсэндээ энэ Текст баримтЗураг бүрийн хувьд оройн цэгүүд ба тэдгээрийн дундуур өнгөрч буй шугамуудын координатууд, түүнчлэн өөр өөр элементүүдийн өнгийг дүрсэлсэн болно. Энэ форматын анхны хувилбар нь 2001 онд гарсан бөгөөд хоёр дахь хувилбар нь одоогоор идэвхтэй хөгжиж байна. Энэ нь ирээдүйтэй, хөгжиж байна гэсэн үг. Давуу талуудын нэг нь жижиг файлын хэмжээ бөгөөд үүнд нэлээд төвөгтэй зургийг хадгалах боломжтой. Тиймээс одоо илүү олон дүрс, пиктограмм, лого болон вэбсайтын бусад элементүүдийг растер хэлбэрээр биш харин энэ форматаар ашиглаж байна. Энэ нь сайтыг илүү хурдан ачаалахад хүргэдэг. SVG форматын өвөрмөц онцлог нь интерактив болон хөдөлгөөнт дүрс юм. Эхнийх нь зураг нь хэрэглэгчийн үйлдэлд хариу өгөх боломжийг олгодог, жишээлбэл, хулганыг дарах эсвэл зарим элементийг хөдөлгөх. Хөдөлгөөнт дүрслэл нь нэлээд төвөгтэй хувилбаруудыг үүсгэх боломжийг олгодог. Бүгд нийлээд вэбсайтуудад зориулсан маш үзэсгэлэнтэй, амьд график элементүүдийг бий болгох боломжийг олгодог. Тэдгээрийг png, jpg болон бусад форматтай ердийн растер зургуудад суулгаж болно.

.SVG файлын өргөтгөл

Интернет дээр та ийм олон зургийг гэрэл зургийн хувьцаанаас, тэр дундаа үнэгүй зургуудаас олж болно. Тэдгээрийг график засварлагчаар бүтээдэг Adobe Photoshop, Illustrator, Corel Draw болон бусад. Гэхдээ SVG форматыг хэрхэн нээх вэ гэсэн асуулт гарч ирнэ. Эцсийн эцэст, суулгасан Windows хэрэгслүүд нь ямар зураг агуулж байгааг харуулахгүй. Хэдийгээр та SVG-г дотор нь ч засах боломжтой текст засварлагчжишээлбэл, Notepad дээр, учир нь энэ нь текст баримт бичиг боловч үүний тулд та тэмдэглэгээний хэл дээр нэлээд мэдлэгтэй байх хэрэгтэй. Та SVG файлыг үүсгэсэн программ эсвэл энэ форматыг дэмждэг өөр график засварлагчаар нээж болно. Хамгийн алдартай:

Мэдээжийн хэрэг, эдгээр нэр нь ажиллахад зориулагдсан програмуудын жагсаалт юм вектор графикшавхагдахгүй байна. Тэдгээрийн дотроос хамгийн алдартай Adobe Photoshop засварлагч нь зургийг вектор болгон хадгалах боломжтой бөгөөд тэдгээрийг нээх нэмэлт өргөтгөлтэй байдаг. Хамгийн алдартай редакторын талаар бүү мартаарай вектор графикХамгийн алдартай гэж нэрлэж болох Corel Draw.

Файлтай холбоотой өөр юу асуудал үүсгэж болох вэ?

Энгийн Windows ашиглан, болон бусад олон үйлдлийн системүүд, SVG файлууд нээгддэггүй. Тэдгээрийн агуулгыг харахын тулд засварлахаас хамаагүй бага бол энэ форматыг дэмждэг график засварлагчийг суулгах хэрэгтэй.

Аливаа вэб хуудсыг зохион бүтээхийн тулд танд статик график, төрөл бүрийн хөдөлгөөнт болон интерактив элементүүд хэрэгтэй бөгөөд энэ нь нэгдүгээрт, түүн дээр үзүүлсэн мэдээллийг илүү сэтгэл татам болгодог, хоёрдугаарт, материалыг илүү сайн ойлгоход хувь нэмэр оруулдаг.

График мэдээлэл нь текстийн мэдээллээс хамаагүй удаан дамждаг бөгөөд зураг ачаалах хугацаа нь тэдгээрийн график файлуудын хэмжээнээс шууд хамаардаг тул вэб хуудсыг хурдан ачаалах нь тэдгээрт суулгагдсан график дүрсний хэмжээ бага байх ёстой гэсэн үг юм. Сүүлийнх нь хүрдэг оновчтой сонголтформат график файл, түүнчлэн оновчлолын тусламжтайгаар хуудас ачаалах хурд ба түүн дээр үзүүлсэн зургийн чанар хоёрын хооронд буулт хийх явдал юм. Гэсэн хэдий ч, оновчлолын боломжууд хязгааргүй биш бөгөөд өндөр чанартай зургууд нь гайхалтай эзэлхүүнтэй байх хандлагатай байдаг. Өндөр чанарВэб дээр жижиг хэмжээтэй зургуудыг танилцуулсан нь ноцтой асуудал хэвээр байна.

Гэхдээ асуулт нь зөвхөн хэмжээ, чанарын тухай биш юм; вэб хуудасны дизайн боловсруулах нь дизайнераас олон төрлийн технологи, програм хангамжийн бүтээгдэхүүнийг мэддэг байхыг шаарддаг асуудал юм. график мэдээлэлТа тэдгээрийг үүсгэхийн тулд төрөл бүрийн файлын формат, өөр өөр технологи ашиглах хэрэгтэй. Статик графикийн хувьд GIF, JPG эсвэл PNG форматыг ашигладаг бөгөөд тэдгээрийг янз бүрийн график багц хэлбэрээр үүсгэж болно. Хөдөлгөөнт объектуудын хувьд хөдөлгөөнт дүрсийн GIF болон Flash форматыг ашигладаг бөгөөд ийм объектуудыг тусгай програм хангамжийн програмуудад (эдгээр төрлийн формат тус бүрд тусгайлан) хөгжүүлдэг. Интерактив элементүүд (өнхрөх, ImageMap холбоосууд гэх мэт) нь дүрмээр бол тусгай програмуудад бүтээгдсэн бөгөөд график дүрсүүдийн багцыг төлөөлдөг бөгөөд тэдгээрийн хоорондын холболтыг HTML код бүхий файлд нөхөж өгдөг.

Эдгээр асуудлыг амжилттай шийдвэрлэх нь XML хэл дээр суурилсан SVG (Scalable Vector Graphics scalable vector graphics) график формат руу шилжих явдал байж болох бөгөөд үүний ачаар ямар ч SVG дүрсийг багц хэлбэрээр дүрслэх боломжтой болно. тушаалын мөрүүд(Зураг 1), SVG файлыг өөрөө ямар ч текст засварлагч, тэр дундаа Notepad дээр нээх боломжтой. Энэ бол харьцангуй юм шинэ технологиЭнэ нь анх Adobe-аас тусгайлан вэбэд зориулагдсан бөгөөд өнөөдөр хөдөлгөөнт төхөөрөмжүүдийн хувьд маш их сонирхол татаж байгаа бөгөөд өндөр чанарын статик, хөдөлгөөнт болон интерактив графикийг бүтээх боломжийг олгодог. Тиймээс үүнийг 2003 онд W3C консорциум (http://www.w3.org/Graphics/SVG) идэвхтэй дэмжиж, SVG 1.1 стандартыг W3C зөвлөмж болгон баталсан нь гайхах зүйл биш юм. Энэ мөч SVG 1.2 тодорхойлолтыг боловсруулж байна (http://www.w3.org/TR/SVG12/).

тохирох зурагтай

SVG технологи нь текст, график, хөдөлгөөнт дүрс, интерактив бүрэлдэхүүн хэсгүүдийг нэг форматаар нэгтгэх боломжийг олгодог бөгөөд вектор хэлбэр, зураг, текст гэсэн гурван төрлийн график дүрс дээр суурилдаг. Вектор графикийн зуршилд дүрсийг шулуун ба муруйн контур эсвэл график командууд (тэгш өнцөгт, эллипс гэх мэт) дүрсэлсэн бөгөөд зураг нь импортын растер зургууд юм. Нэмж дурдахад SVG формат нь янз бүрийн төрлийн хөдөлгөөнт (GIF болон Flash хөдөлгөөнт дүрсийг санагдуулдаг) болон интерактив объектуудыг, тухайлбал өнхрөх, холбоосын газрын зураг болон бусад навигацийн элементүүдийг дэмждэг. Энэхүү стандарт нь XML хэл дээр суурилсан тул SVG файл нь харааны дэлгэцэнд зориулагдсан элементүүдийн хамт янз бүрийн мета өгөгдлийг агуулж болно.

SVG форматыг ашиглахын давуу болон сул талууд

SVG форматыг ашигласнаар өөр ямар ч график форматаар хангаж чадахгүй жижиг хэмжээтэй, хурдан ачаалагддаг, өндөр чанартай, олон талт графикийг вэб болон хөдөлгөөнт төхөөрөмжид ашиглах боломжтой. SVG график форматын гол давуу талууд нь дараахь зүйлийг агуулдаг.

• хэмжээнээс үл хамааран зургийн өндөр чанар нь SVG форматын вектор шинж чанараар тайлбарлагддаг. Дэлгэцийн хэмжээнээс хамааран зургийг чанараа алдалгүйгээр тодорхойгүй хугацаагаар багасгаж эсвэл томруулж болно (Зураг 2), энэ нь танд авах боломжийг олгодог. өндөр чанартай зурагдээр график мэдээлэл янз бүрийн төрөлтөхөөрөмжүүд (ширээний компьютер, халаасны компьютер гэх мэт), мөн бие даасан нарийн ширийн зүйлийг нарийвчлан судлах боломжтой болгодог, жишээлбэл, техникийн зурагтай ажиллахад чухал ач холбогдолтой;
• их жижиг хэмжээтэйфайлуудыг GIF, JPG, PNG болон хөдөлгөөнт GIF форматтай харьцуулахад, мөн Flash форматтай харьцуулахад илүү их байдаг. Жишээлбэл, хэрэв файл нь нийтлэлийг туршиж үзсэн бол GIF формат, LZW шахалтын горимд шахагдсан нь 26 KB байсан, харгалзах SVG файлын хэмжээ 1220 байт, SVGZ форматаар шахагдсан үед ердөө 685 байт байв.

Гэхдээ энэ нь зөвхөн энэ биш юм. Вэбийг графикаар дүрслэх уламжлалт сонголтуудтай харьцуулахад SVG форматыг ашиглах нь бусад маргаангүй давуу талуудтай.

Тиймээс хөгжүүлэгчдэд чухал давуу талууд нь:

• статик, хөдөлгөөнт болон интерактив элементүүдийг нэг форматаар нэгтгэх чадвар, түүнчлэн вектор ба растер объектуудын хослол;
• kerning, муруй текст, хязгааргүй үсгийн хэрэглээ зэрэг текстийн боловсруулалтыг сайжруулсан;
• өнгөний нарийвчлалыг илүү үр дүнтэй хянах, вэб зураг дээр градиент дүүргэлтийг ашиглах илүү их боломжууд өндөр нарийвчлалтай, сүүдэр, шүүлтүүр гэх мэт;
• SVG форматын текстийн шинж чанар, түүний каскадын загварын хуудасны дэмжлэг нь вэбсайтыг шинэчлэх үйл явцыг ихээхэн хөнгөвчлөх, шаардлагатай бол түүнд хандахгүйгээр өөрчлөлт оруулах боломжийг олгодог. тусгай хөтөлбөрүүд;
• XML (Extensible Markup Language) болон CSS (Cascading Style Sheets) стандартууд дээр суурилсан мэдээллийн сантай нэгтгэх нь SVG зургийг мэдээллийн санд хадгалах, тэдгээрийг ашиглан үүсгэх боломжийг олгодог. динамик вэб хуудсуудөөр өөр платформ, хувийн тохиргоо гэх мэт өөр өөр;
• индексжүүлэх асуудал байхгүй SVG файлуудыг ямар ч хайлтын системээр индексжүүлдэг (жишээ нь, SWF файлуудаас ялгаатай).

Хэрэглэгчид өндөр чанартай, хурдан ачаалагддаг SVG контентыг үзэх болно. Нэмж дурдахад, SVG зураг дээрх текстийг хуулж, өөртөө хэрэгтэй мэдээллийг хадгалах, мөн зураг дээрх текстийг хайх боломжтой бөгөөд энэ нь зарим тохиолдолд, жишээлбэл, хайх үед маш их шаардлагатай байж болох юм. газрын зураг эсвэл зураг дээрх хүссэн нэрийг .

Гэсэн хэдий ч ердийнх шиг SVG технологи нь давуу талуудаас гадна сул талуудтай бөгөөд маш ноцтой байдаг.

• SVG зургийг интернет хөтөч үйлдвэрлэгчид муу дэмждэг. Үүний үр дүнд SVG графикийг хөтчөөс үзэхийн тулд хэрэглэгчид энэ боломжийг олгодог гуравдагч талын залгаасыг, жишээлбэл Adobe-ийн SVG Viewer-ийг нэмэлт суулгах шаардлагатай болдог. Онолын хувьд энэ нь тийм ч хэцүү биш бөгөөд холбогдох залгаасуудыг суулгахад хялбар, үнэ төлбөргүй, жижиг хэмжээтэй, интернетээс хурдан татаж авах боломжтой. Практикт бүх зүйл илүү төвөгтэй болж хувирдаг, учир нь ихэнх интернет хэрэглэгчид эдгээр боломжууд байгааг мэддэггүй тул харах боломжгүй байдаг. энэ төрөлзалгаасгүй график нь зүгээр л харагдахгүй. Гэсэн хэдий ч нөхцөл байдал аажмаар өөрчлөгдөж байгаа бөгөөд өнгөрсөн жил хоёр тэргүүлэх вэб хөтөч хөгжүүлэгчид SVG форматын дэмжлэгийг нэвтрүүлсэн. Хавар Opera Software нь SVG 1.0 Tiny-ийг дэмждэг Opera хөтчийн 8-р хувилбарыг гаргасан; Хэсэг хугацааны дараа гарч ирсэн Opera 9.0 хувилбарт SVG 1.0 Basic форматын хэсэгчилсэн дэмжлэгийг хэрэгжүүлсэн. SVG-ийн дэмжлэгийг оруулсан хоёр дахь хөгжүүлэгч нь The Mozilla Organization байлаа.1.1-ийн SVG графикийг үзэх боломжийг олгодог Mozilla SVG төслийн модулийг Firefox 1.5 хөтөч дээрээ оруулсан. Нэмж дурдахад, 2005 оны дундуур Mac OS X үйлдлийн системтэй компьютер дээр ажилладаг Safari хөтчийг хөгжүүлэгчид SVG 1.1-ийн дэмжлэгийг нэвтрүүлэх идэвхтэй ажиллаж эхэлсэн;
• Бусад график форматтай харьцуулахад Adobe Illustrator, Corel DRAW гэх мэт тэргүүлэх график багцууд нь графикийг SVG файл руу экспортлох боломжийг олгодог ч SVG форматыг график программ хангамж хөгжүүлэгчид төдийлөн сайн дэмждэггүй. Мэдээжийн хэрэг, SVG файлуудыг ямар ч текст засварлагчаар үүсгэж болох боловч энэ нь хурд болон хөгжлийн зардлын хувьд практик биш юм. Шаардлагатай бол текст засварлагч дээр файлыг засварлах нь тохиромжтой (дашрамд хэлэхэд та XML технологийн талаар гүнзгий мэдлэгтэй бол л боломжтой), гэхдээ үүнийг эхнээс нь үүсгэх нь хэтэрхий их цаг хугацаа, хүчин чармайлт шаарддаг тул ухаалаг биш юм. Үүнийг хийхийн тулд бидэнд ижил орчинд зурагт тохирсон програмын кодыг засварлах чадвартай, масштабтай вектор график форматаар графикийг хурдан дүрслэн хөгжүүлэх энгийн бөгөөд тохиромжтой хэрэгсэл хэрэгтэй боловч ийм бүтээгдэхүүн маш цөөхөн байдаг бөгөөд тэдгээр нь тийм биш юм. сайн мэддэг.

Үүний үр дүнд маш гунигтай нөхцөл байдал үүсдэг: вэб хөтчүүдэд зохих түвшинд дэмжлэг үзүүлэхгүйн улмаас олон хэрэглэгчид SVG графикийг үзэж чадахгүй байгаа тул вэб хөгжүүлэгчид хичнээн сонирхолтой байсан ч SVG графикийг бараг хөгжүүлдэггүй. Програм хангамж хөгжүүлэгчид вэб дизайнеруудыг SVG дээр тусгайлан зориулсан төрөл бүрийн програмуудаар өөгшүүлдэггүй. Үр дүн нь харгис тойрог юм: "Хэрэв контент байхгүй бол хүмүүст SVG-ийн хэрэгжилт шаардлагагүй, хэрэв хэрэгжихгүй бол агуулга байхгүй" гэж W3C консорциумын нэгэнд нөхцөл байдлыг яг ингэж тодорхойлсон байдаг. уулзалтууд.

Гэхдээ та нөхцөл байдлыг нөгөө талаас нь харж болно: хоёр алдартай интернет хөтчөөр SVG-ийг (хэдийгээр бүрэн гүйцэд биш ч гэсэн) дэмжиж байгаа, мөн алдартай хөгжүүлэгчдийн технологийг сонирхож байгаа нь "мөс хагарсан" гэсэн үг юм. SVG нь вэб мэдээллийг танилцуулах түгээмэл форматуудын нэг болох бодит боломж юм. Зургийн хэмжээ, чанарт тавигдах шаардлага илүү өндөр байдаг хөдөлгөөнт төхөөрөмжтэй холбоотой SVG технологийг сонирхож байгаатай холбоотойгоор энэ боломж нэмэгдэж байна. Жишээлбэл, Opera програм хангамж нь эхлээд ширээний компьютер дээр SVG форматыг бүрэн дэмжихээр төлөвлөж, дараа нь гар утасны платформ руу шилжүүлэхээр төлөвлөж байна. Тиймээс вэб дизайнерууд SVG ашиглах талаар бодох цаг болжээ, эс тэгвээс тэд ойрын ирээдүйд хоцрох эрсдэлтэй.

SVG графикийг үзэх нэмэлт өргөтгөлүүд

Өмнө дурьдсанчлан, одоогоор ихэнх хэрэглэгчид SVG графикийг интернет хөтчийн цонхонд бүрэн хэмжээгээр нь үзэхийн тулд тохирох залгаасуудын аль нэгийг ашиглах шаардлагатай болно, хамгийн алдартай нь үнэгүй Adobe SVG Viewer болон Corel SVG Viewer модулиуд юм. Тэдгээрийн эхнийх нь Adobe SVG Viewer нь тусдаа програм хэлбэрээр ирдэг, авсаархан, тохиромжтой, өөр өөр платформ дээр ажилладаг, олон тооны интернет хөтчүүдийг дэмждэг тул хэрэглэгчдийн дунд илүү түгээмэл байдаг. Corel SVG Viewer аппликейшн нь Corel Smart Graphics Studio багцад багтсан боловч үнэ төлбөргүй программ хэлбэрээр ашиглах боломжтой.

SVG графикийг үзэх өөр сонголтууд байдаг; та жишээ нь Amaya (http://www.w3.org/Amaya/), Apache Batik (http://xml.apache.org/)-ийн холбогдох модулиудыг ашиглаж болно. batik) багцууд, KDE KSVG (http://www.kde.org) гэх мэт. SVG зургийг үзэх боломжийг олгодог програмуудын бүрэн жагсаалтыг: http://wiki.svg.org/Viewer_Implementations.

Adobe SVG Viewer

Хөгжүүлэгч: Adobe Systems, Inc.

Түгээлтийн хэмжээ: 2.25 MB

Түгээх арга:үнэгүй програм (http://download.adobe.com/pub/adobe/magic/svgviewer/win/3.x/3.03/en/SVGView.exe)

Үнэ:үнэгүй

Хяналт дор ажиллана: Windows 95/98/Me/NT/2000/XP, Mac OS 8.6/9/X, Linux, Solaris

Хөтөчийн дэмжлэг: Internet Explorer 4.0 ба түүнээс дээш хувилбар, Netscape Navigator эсвэл Communicator 4.5-4.78 (6.x-аас бусад)

Corel SVG Viewer

Хөгжүүлэгч: Corel Corp

Түгээлтийн хэмжээ: 4.9 MB

Түгээх арга:үнэгүй програм (модулийг http://www.corel.com/servlet/Satellite?pagename=Corel/Downloads/Details&id=1042152917172 хаягаас татаж авч болно)

Үнэ:үнэгүй

Хяналтанд байгаа ажил: Windows 98/NT/2000/Me/XP

Хөтөчийн дэмжлэг: Microsoft Internet Explorer 5.5 ба түүнээс дээш хувилбар, Netscape Navigator эсвэл Communicator хувилбарууд 4.79, 7.02

SVG график үүсгэх програмууд

SVG график үүсгэх бүх програмыг гурван том бүлэгт хувааж болно. Эхнийх нь вектор графиктай ажиллахад чиглэсэн алдартай хоёр хэмжээст график багцуудыг багтаасан бөгөөд нэгэн зэрэг зургийг SVG формат руу экспортлох боломжийг олгодог. Тэдгээрийн хамгийн алдартай нь Adobe Illustrator болон CorelDRAW юм; Нэмж дурдахад ийм экспорт нь AutoCAD, Microsoft Visio гэх мэт бусад олон програмуудыг нэг хэмжээгээр дэмждэг. Энэ бүлгийн програмуудын гол давуу тал нь вектор дүрс үүсгэх дэвшилтэт хэрэгслүүдтэй бөгөөд ашиглах замаар өвөрмөц эффект гаргах боломжийг олгодог. ил тод байдал, градиент дүүргэлт, янз бүрийн шүүлтүүр гэх мэт. Гэхдээ эдгээр програмууд нь ноцтой тусгай сургалт шаарддаг тул мэргэжлийн дизайнеруудад зориулагдсан байдаг. Нэмж дурдахад тэдгээр нь SVG дизайн дээр төвлөрсөн бус (хэдийгээр тэдгээр нь масштабтай вектор график форматаар график авах боломжийг олгодог боловч) дүрсийг хялбархан бүтээх, харуулах боломжийг олгодог боловч эдгээр програмууд нь тэдгээрийг текст дээр тохируулахыг зөвшөөрдөггүй. түвшин, энэ нь SVG графикт хамааралтай. Өргөтгөх боломжтой вектор графикийн форматыг дэмжих нь тэдгээрт бүрэн хэрэгжээгүй байгаа нь чухал бөгөөд үүний үр дүнд бүх вектор зургийн элементүүдийг SVG-д алдаагүйгээр экспортлох боломжгүй юм.

Хоёрдахь бүлгийн програм хангамжийн бүтээгдэхүүн нь зөвхөн SVG график үүсгэхэд зориулагдсан багцуудаас бүрдэнэ. Эдгээр нь шаардлагатай бүх хэрэгслийг багтаасан боловч вектор дүрсийг дүрслэх чадвар багатай байдаг. Гэхдээ тэдгээр нь эх кодыг засварлахад тохиромжтой хэрэгслээр хангадаг бөгөөд SVG объектуудтай визуал болон кодын түвшинд зэрэгцэн ажиллах боломжийг олгодог бөгөөд та мэдээллийг танилцуулах эдгээр сонголтуудын хооронд хялбархан шилжих боломжтой. Энэ бүлгийн бүх програмууд нь маш энгийн бөгөөд хүртээмжтэй бөгөөд сурахад их цаг хугацаа шаарддаггүй. Нэмж дурдахад тэдгээр нь харьцангуй бага тархалттай (эхний бүлгийн програмуудтай харьцуулахад) тул тэдгээрийг интернетээр ямар ч асуудалгүйгээр худалдан авч болно. Гэсэн хэдий ч ийм чадвартай програмууд маш цөөхөн байдаг бөгөөд доор бид зөвхөн хамгийн их сонирхол татсан, янз бүрийн ангилалд хамаарах хэрэглэгчдэд зориулагдсан дөрөвийг нь нарийвчлан авч үзэх болно. ХАМТ бүрэн жагсаалт SVG график үүсгэх боломжтой програмуудыг: http://wiki.svg.org/Design_Tools хаягаас олж болно.

Эцэст нь гурав дахь бүлэгт ердийн тэмдэглэлийн дэвтэр зэрэг ямар ч текст засварлагч багтаж болно. Дээр дурдсанчлан, Scalable Vector Graphics формат нь XML хэл дээр суурилдаг бөгөөд шаардлагатай бол текст засварлагчийн текстийн түвшинд SVG файлуудыг үүсгэх, засварлах боломжийг олгодог.

SVG график үүсгэх бүрэн боломжтой график програмууд

Adobe Illustrator CS2

Хөгжүүлэгч: Adobe Systems, Inc.

Түгээлтийн хэмжээ: Macintosh хувилбар 428.9 MB, Windows хувилбар 398.6 MB

Түгээх арга: shareware (багцын 30 хоногийн демо хувилбарыг эндээс авах боломжтой: http://www.adobe.com/products/tryadobe/main.jsp#product=27)

Үнэ: 665 доллар

Хяналтанд байгаа ажил: Windows 2000, Service Pack 3 эсвэл Windows XP, Mac OS X 10.2.4-10.2.7 хувилбарууд, Java Runtime Environment 1.4.1

9-р хувилбараас эхлэн Adobe Illustrator (Зураг 3) нь SVG файлуудыг импортлох, экспортлох, ижил төстэй график програмуудтай харьцуулахад илүү өндөр түвшинд хэрэгжүүлсэн. Энэхүү багц нь одоо байгаа бүх SVG техникийн үзүүлэлтүүд, ISO 8859-1, UTF-8 болон UTF-16 кодчилол, төрөл бүрийн текст экспортын сонголтуудыг дэмждэг бөгөөд ердийн SVG формат болон шахсан SVGZ аль алинд нь зургийг экспортлох боломжийг олгодог.

Түүний орчинд үүсгэсэн SVG график дээр та градиент, ил тод байдал, түүнчлэн тусгайлан боловсруулсан SVG эффектүүдийн бүхэл бүтэн цувралыг (Effect=>SVG шүүлтүүрүүд) янз бүрийн сүүдэр, бүдэгрүүлэх гэх мэт хэлбэрээр ашиглаж болно. Ийм эффект бүхий зургууд хэвээр үлдэнэ. вэб хөтчөөр ямар ч томруулж үзэхэд тодорхой болно. Статик графикаас гадна Illustrator нь SVG форматаар интерактив график үүсгэх боломжийг олгодог бөгөөд энэ зорилгоор тусгай SVG Interactivity палитр (үүнийг Window=>SVG Interactivity цэснээс нээж болно), интерактив объектуудад зориулсан үйлдэл хийдэг. тодорхойлсон байна. Illustrator дээр интерактив SVG элементүүд дээр ажиллахын тулд Java Script-ийн мэдлэг, объект хандалтат програмчлалын үндсэн зарчмуудыг ойлгох шаардлагатай гэдгийг тэмдэглэх нь зүйтэй. Нэмж дурдахад, энэ програмын Scalable Vector Graphics форматыг ашиглан та Динамик өгөгдөлд суурилсан график үүсгэх боломжтой.

CorelDRAW Graphics Suite 12

Хөгжүүлэгч: Corel Corp.

Түгээлтийн хэмжээТива: 200 MB

Түгээх арга: shareware (демо хувилбарыг онлайн дэлгүүрийн сайтуудаас татаж авч болно, жишээ нь: http://allsoft.ru/Download.php?ver=17605)

Үнэ:$290 (Allsoft.ru)

Хяналтанд байгаа ажил: Windows NT/2000/XP

CorelDRAW Graphics Suite 12-д багтсан мэргэжлийн вектор график боловсруулахад зориулагдсан алдартай програм болох CorelDRAW (Зураг 4) нь үндсэн түвшинд SVG болон SVGZ форматаар импортлох, экспортлох боломжийг олгодог тул статик болон интерактив үүсгэхэд ашиглаж болно. SVG график.

CorelDRAW дахь SVG файл руу

Аппликешн нь танигдаагүй өгөгдөл, шинж чанар, мета өгөгдлийг дэмждэг бөгөөд мөн боломжийг олгодог урьдчилан үзэхЭкспортлохын өмнө SVG файлуудыг хөтөч дээр суулгана. Нэмж дурдахад UTF-8 ба UTF-16 кодчилолын аргууд болон текст болон битмап зургийг экспортлох янз бүрийн сонголтуудад Юникод кодчилол хийх боломжтой. IN Хамгийн сүүлийн үеийн хувилбарТэмдэглэгээ, текст, сүүдэр, тойм, давхарга, суулгагдсан хоёртын дүрс гэх мэтийг экспортлох дэмжлэгийг мэдэгдэхүйц сайжруулсан.

Mayura Draw 4.3

Хөгжүүлэгч:Майура програм хангамж

Түгээлтийн хэмжээ: 1.3 MB

Түгээх арга: shareware (демо хувилбар http://www.mayuradraw.com/mdraw.zip)

Үнэ: 39 доллар

Хяналтанд байгаа ажил: Windows 95/98/Me/NT/2000/XP

Mayura Draw (Зураг 5) нь энгийн хэрэглэгчдэд зориулагдсан маш энгийн бөгөөд хямд вектор график үүсгэх програм юм. Үүссэн вектор зургуудыг хүсвэл SVG формат руу экспортлох боломжтой тул Mayura Draw нь статик SVG графикийг хөгжүүлэх боломжит шийдэл байж болно. Програм нь вектор графикийн бүх үндсэн хэрэгслийг дэмждэг бөгөөд график команд, шугаман болон муруй шугам, текст дээр суурилсан вектор дүрсийг авах боломжийг олгодог. Түүний чадавхийн жагсаалтад объектыг тэгшлэх, хуваарилах, зохион байгуулах, ил тод байдлыг удирдах, объектыг нарийн байрлуулахын тулд чиглүүлэгч, захирагч ашиглах, янз бүрийн хувиргалт хийх тохиромжтой хэрэгсэл орно.

SVG график үүсгэх тусгай багцууд

EvolGrafiX XStudio 6.1

Хөгжүүлэгч: EvolGrafiX

Түгээлтийн хэмжээ: 7.25 MB

Түгээх арга: http://www.evolgrafix.de/htDocs/files/trials/xstudio6x/XStudio6-Trial.exe)

Үнэ: 449 долларын арилжааны лиценз, 249 долларын академик лиценз

Хяналтанд байгаа ажил: Windows 2000/XP

XStudio мэргэжлийн багц (Зураг 6) нь вэб болон хөдөлгөөнт төхөөрөмжүүдэд зориулсан төрөл бүрийн SVG график үүсгэхэд тохиромжтой хэрэгсэл бөгөөд SVG төслийг бүхэлд нь болон вектор зураг, хөдөлгөөнт дүрс, скрипт гэх мэтийг бүрэн хянах боломжийг олгодог. тохиромжтой, ойлгомжтой, өөрчлөхөд хялбар Хэрэглэгчийн интерфэйс, өргөн хүрээний хэрэгслээр хангадаг, байна өндөр хурдЭнэ нь одоо байгаа бүх техникийн үзүүлэлтүүдийн SVG графикийг үүсгэх боломжийг олгодог бөгөөд бүх масштабтай вектор графикийн хэв маягийг дэмждэг. Энэ бүхэн нь мэргэжлийн багцын харьцангуй хямд үнэтэй хослуулсан нь энэ төрлийн хамгийн шилдэг мэргэжлийн шийдэл гэж үзэх боломжийг бидэнд олгодог. XStudio нь хэд хэдэн хичээлээр дэмжигдсэн нарийвчилсан баримт бичгийн хамт ирдэг бөгөөд сурахад хялбар байдаг.

Цагаан будаа. 6. Визуал дүрс бүтээхийг эх код засварлахтай хослуулах
EvolGrafiX XStudio дээр

Уг програм нь вектор зураг үүсгэх, боловсруулахад шаардлагатай бүх чадвартай бөгөөд энэ талаараа Adobe Illustrator багцтай маш төстэй юм. Үүний зэрэгцээ XStudio нь статик, интерактив болон хөдөлгөөнт SVG графикийг бэлтгэхэд шууд чиглэгддэг тул вектор объектуудтай ажиллах сонгодог хэрэгслүүдийн хамт SVG-ийн тусгай боломжоор нэмэгддэг. Баригдсан Document Object Model (DOM) хэрэгслийн самбар нь SVG объектуудын шаталсан дүрслэлийг өгдөг, тохиромжтой XML засварлагч нь эх кодыг текстийн түвшинд засах боломжийг олгодог бөгөөд скрипт засварлагч нь Java скриптүүдээр баяжуулах боломжийг олгодог. Кодтой ажиллах нь маш тохиромжтой зохион байгуулалттай: сонгосон объектын кодын хэсгүүдийг автоматаар тодруулж, текст хайх, хавчуурга тавих гэх мэт. Аливаа кодын өөрчлөлтийг визуал харах цонхонд шууд тусгадаг бөгөөд харааны өөрчлөлтүүд нь цонхонд тусгагдсан байдаг. редакторын цонх.

Inkscape

Хөгжүүлэгч: IOSN (Олон улсын Нээлттэй эх сурвалжОлон улсын нээлттэй эхийн сүлжээ)

Түгээлтийн хэмжээ: 8.7 MB

Үнэ:үнэгүй

Хяналтанд байгаа ажил: Windows 9x/NT/2000/XP, Mac OS X, Linux

Inkscape (Зураг 7) хамгийн ирээдүйтэй вектор засварлагчНээлттэй эхийн загвар дээр суурилсан бөгөөд энэ нь олон платформ бөгөөд Scalable Vector Graphics стандартын дагуу график боловсруулах хүчирхэг хэрэгсэл юм. өөрсдийнхөөрөө функциональ байдалвектор зураг, түүнчлэн интерфэйстэй ажиллах Inkscape нь CorelDRAW-тай маш төстэй юм. Энэ нь альфа сувгуудыг дэмждэг, давхаргатай ажиллах, урсгалтай текст, гайхалтай градиент дүүргэлт, олон тооны шүүлтүүр, эффект, янз бүрийн хувиргалт, тохиромжтой ажилконтур ба объект, бүлэглэх объект болон бусад олон зүйлс. Та JPEG, PNG, TIFF файлуудаас өгөгдөл импортлох, SVG зураг руу оруулах боломжтой.

суулгасан Inkscape засварлагч

Гэсэн хэдий ч CorelDRAW-ээс ялгаатай нь Inkscape нь SVG дизайнеруудад зориулагдсан программ юм, тиймээс сонгодог визуал график үүсгэхийн зэрэгцээ суурилагдсан текст засварлагч дээр XML кодыг шууд боловсруулах боломжийг олгодог. Хөтөлбөр нь ердийн болон шахсан SVG файлд зургийг хадгалахаар тохируулагдсан боловч хэрэв хүсвэл тэдгээрийг нийтлэг вектор болон растер формат руу хөрвүүлэх боломжтой.

Inkscape багц нь тохиромжтой орос хэлтэй интерфэйстэй, сурахад хялбар бөгөөд янз бүрийн хэрэглээний жишээг багтаасан сайн тусламжийн системтэй хамт ирдэг. энэ програмүнэ төлбөргүй энэ бүхэн нь өргөн хүрээний хэрэглэгчдийн сонирхлыг татахуйц болгодог. Хөтөлбөрийн гол сул тал нь түүний ажиллах хурд бага, системийн нөөцөд тавигдах шаардлага нэмэгдсэн явдал юм.

Corel WebDraw

Хөгжүүлэгч: Corel Corp

Түгээлтийн хэмжээ: 15.6 MB

Түгээх арга: shareware (30 өдрийн демо http://www5.jasc.com/pub/wdw102ev.exe)

Үнэ:Татаж авах хувилбар $179, CD хувилбар $199

Хяналтанд байгаа ажил: Windows 98/NT4/2000/Me/XP

Corel WebDraw (Зураг 8) нь Jasc WebDraw гэгддэг бөгөөд мэргэжлийн дизайнеруудад зориулагдсан өндөр чанартай SVG график, хөдөлгөөнт дүрсийг бүтээх цогц шийдэл юм. Хөтөлбөрийн ойлгомжтой интерфэйс нь түүнийг өргөн хүрээний хэрэглэгчдийн сонирхлыг татахуйц болгодог.

Энэхүү програм нь бүрэн хэмжээний вектор графикийн хэрэглээний стандарт график хэрэгслүүдийн өргөн хүрээг хангадаг: үндсэн дүрсүүд (зууван, тэгш өнцөгт, од гэх мэт), үзэг, олон өнцөгт, олон өнцөгт, текст гэх мэт. Вектор объектуудын хамт WebDraw нь SVG объектуудыг гаднах объектоор нөхөх боломжийг олгодог растер зургууд. Тогтмол дүүргэх, бэлэн хэв маягийг давхарлахаас гадна та нарийн төвөгтэй градиент, дүүргэлт, түүний дотор өөрөө бүтээсэн хэв маягийг ашиглаж болно. Илүү үр дүнтэй зураг авахын тулд та маш энгийн (бүдгэрүүлэх, сүүдэрлэх) болон төвөгтэй (бүдгэрэлт, гэрэлтүүлэг) шүүлтүүрийг ашиглаж болно. Тор, чиглүүлэгч, захирагч нь объектыг нарийн байрлуулахад тусалдаг бөгөөд суулгасан Баримт бичгийн объектын загвар (DOM) хэрэгслийн самбар нь SVG объектуудыг шаталсан модоор хялбархан удирдах боломжийг олгодог.

WebDraw нь SVG DOM (Баримт бичгийн объектын загвар) дээр үндэслэсэн, бүх төрлийн объектын бараг бүх шинж чанар, шинж чанарыг хүссэн үедээ сонгож, хөдөлгөөн хийх боломжийг олгодог бүх нийтийн хөдөлгөөнт дүрсний самбарын шугам болох Animation Timeline-аар тоноглогдсон. . Чирэх, буулгах механизм нь хөдөлгөөнт дүрсийн эхлэл ба төгсгөлийн цэгүүдийг, мөн хөдөлгөөнт дүрс бүрийн үе шат бүрийн үргэлжлэх хугацааг цагийн хуваарьт шууд засах боломжийг олгодог. Таныг объектын шинж чанар эсвэл шинж чанарт хөдөлгөөнт дүрсний сонголтуудыг тохируулах бүрт анимейшн түлхүүр цагуудыг оруулдаг тул тэдгээрийг дараах зорилгоор өгүүллийн самбарын бусад хэсэгт зөөж болно. автомат тохиргоохөдөлгөөнт эффектүүдийн цаг хугацааны хуваарилалт.

Энэхүү багц нь SVG графиктай хоёр хувилбараар ажиллах боломжийг олгодог: визуал байдлаар харуулсан график объектуудын багц болон харгалзах эх кодтой. SVG файлын текст засварлагчийн эх кодыг засварлах нь нэмэлт уян хатан байдал, файлын агуулгыг хянах боломжийг олгодог. Автомат шалгахЭх кодын өөрчлөлт нь үүсгэсэн графикийн зөв үйлдлийг хангахад тусалдаг бөгөөд олсон алдаанууд нь өнгөөр ​​​​тэмдэглэгдсэн бөгөөд энэ нь дизайнерыг хэдэн зуун мөр кодыг хайж олохоос хамгаалдаг. Эх кодын аливаа өөрчлөлтийн үр дүн шууд дэлгэцэн дээр гарч ирнэ. Хэрэв хүсвэл бусад программ дээр үүсгэсэн SVG файлуудыг WebDraw руу импортлох, засварлах, оновчтой болгох боломжтой.

Sketsa SVG Editor 3.2.3

Хөгжүүлэгч:КИЮТ

Түгээлтийн хэмжээ: 5.99 MB

Түгээх арга: shareware (зураг дээр шошго нэмдэг демо, http://www.kiyut.com/products/sketsa/sketsa.zip)

Үнэ: 49 доллар

Хяналт дор ажиллана: Windows 2000/XP, Java VM (JRE) 1.5 ба түүнээс дээш (http://www.java.com/getjava), UNIX болон Linux

Sketsa програм (Зураг 9) нь хамгийн алдартай SVG засварлагчдын нэг бөгөөд SVGZ форматаар оновчтой болгох зэрэг мэргэжлийн SVG график үүсгэх боломжийг олгодог. Энэхүү багц нь энгийн, ашиглахад хялбар байдлыг өргөн хүрээний функцуудтай амжилттай хослуулсан бөгөөд Windows, Mac болон Linux системүүдтэй нийцдэг.

Sketsa нь ямар ч вектор хэрэглээнд зориулагдсан сонгодог хэрэгслүүдийг дэмждэг бөгөөд энэ нь контур, график команд, текст дээр үндэслэн дурын вектор объектыг үүсгэх, өөрчлөх боломжийг олгодог бөгөөд хэрэв хүсвэл тэдгээрийг растер зургаар хялбархан нэмж болно. Та ил тод байдлыг хянах, градиент дүүргэлт, шүүлтүүр ашиглах боломжтой. Энэ бүхэн нь тусгай SVG боломжоор амжилттай нөхөгдөж байгаа бөгөөд үүний ачаар ямар ч зургийг зөвхөн нүдээр биш, бас засварлах боломжтой. текст горим. SVG кодыг засахын тулд багц нь суурилагдсан XML текст засварлагчаар хангадаг. Объектыг удирдахад хялбар болгох үүднээс SVG баримт бичигт байгаа шаталсан мод шиг объектуудын багц болох Document Object Model (DOM) хэрэглүүрийн самбар байдаг бөгөөд энэ нь аливаа баримт бичгийн объектыг сонгож шинж чанарыг нь засах боломжийг олгодог.

Хамгийн алдартай график редакторуудзургийг хэд хэдэн форматаар хадгалах боломжийг танд олгоно. Хэрэв програм растер графиктай ажилладаг бол файлыг хадгалахад растер форматыг, вектор графиктай бол вектор форматыг санал болгодог. Гэсэн хэдий ч зургийг вектор болон холимог формат руу экспортлохыг дэмждэг растер редакторууд байдаг. Жишээлбэл, Adobe Photoshop програм нь зургийг SVG рүү экспортлох боломжтой бөгөөд энэ нь растер болон вектор график хоёуланг нь хадгалах боломжтой нэлээд түгээмэл формат юм.

SVG формат гэж юу вэ, хаана ашигладаг вэ?

2001 онд Консорциумаас боловсруулсан World Wide Web, SVG формат нь яг таарахгүй байна энгийн баримт бичиг. Энэ нь VML болон PGML тэмдэглэгээний хэл дээр суурилдаг, өөрөөр хэлбэл бид үндсэндээ текст файлын тухай ярьж байна. Энэ тохиолдолд засварлагчид болон хөтчүүд SVG-г зураг гэж тайлбарладаг бөгөөд энэ нь хөдөлгөөнгүй эсвэл хөдөлгөөнт байж болно. Вектор графикийг хадгалахад зориулагдсан бусад форматуудын дунд хамгийн түгээмэл нь болох SVG нь одоогоор вектор болон холимог зургийг интернетэд хадгалах, түгээхэд идэвхтэй ашиглагдаж байна.

Бүх форматуудын нэгэн адил SVG нь давуу болон сул талуудтай. Эхнийх нь чанарыг алдагдуулахгүйгээр өргөтгөх боломжтой, харьцангуй хөнгөн жинтэй, PNG, GIF, JPG зургийг SVG баримт бичигт нэгтгэх чадвар, текст засварлагч дээр засварлах (хэрэв танд тохирох туршлагатай бол), хайлтын роботоор индексжүүлэх, хөдөлгөөнт дүрсийг дэмжих, тархалт зэрэг орно. Форматын давуу тал нь сайн шахагдах, нээлттэй байдал, дасан зохицох чадварыг агуулдаг.

Нөгөөтэйгүүр, SVG нь алдаа дутагдлаа бүх үйлчлэгчтэй нь өвлөн авдаг. SVG файлууд нь олон жижиг хэсгүүдээс бүрдэх тохиолдолд хурдан жин нэмдэг тул энэ формат нь нарийн төвөгтэй объект үүсгэхэд тохиромжгүй байдаг. Нэмж дурдахад, програмууд зургийг харуулахын тулд баримт бичгийг бүхэлд нь унших шаардлагатай байдаг бөгөөд энэ нь зураглалын програмуудад форматыг ашиглахад хэцүү болгодог. Форматын сул талуудын дунд хөтчүүд хоорондын нийцтэй байдал харьцангуй бага, 3D графикийн хувьд хамгийн бага дэмжлэг байхгүй байгааг бид тэмдэглэж байна.

SVG файлуудтай ажиллах шилдэг редакторууд

Өмнө дурьдсанчлан, та ердийн текст засварлагч дээр SVG файлыг засах боломжтой боловч үүнийг хийхийн тулд та тодорхой мэдлэгтэй байх хэрэгтэй. Вектор график засварлагчийг ашиглах нь илүү тохиромжтой бөгөөд зөв юм.

Adobe Illustrator

SVG засварлагчийн үүрэг гүйцэтгэхэд тохиромжтой хамгийн ажиллагаатай хэрэгсэл. Adobe Illustrator нь вектор болон хосолсон графиктай ажиллах гайхалтай хэрэгслүүдтэй. Энэ нь танд энгийн ноорог болон нарийн төвөгтэй уран сайхны дүрслэлийг үүсгэх, засах боломжийг олгодог. SVG форматтай ажиллахдаа редактор нь давхаргууд болон скрипт хэлийг ашиглах, тусгай эффект ашиглахыг зөвшөөрдөг.

Boxy SVG

Та мөн энэ форматтай ажиллахад зориулж тусгайлан бүтээсэн Boxy SVG програмыг ашиглан SVG зургийг нээх боломжтой. Энэ засварлагч нь Adobe Illustrator-аас олон талаараа доогуур боловч та үүнээс бүх зүйлийг олох болно үндсэн хэрэгсэл SVG зураг үүсгэх, засварлах. Энэхүү програм нь дүрс, объекттой ажиллах, алдартай форматын фонт, зургийг импортлох, Pixabay номын сантай ажиллах, SVG болон CSS эх кодыг үзэх, засварлах зэрэгт дэмжлэг үзүүлдэг. Boxy SVG нь онлайн үйлчилгээ болон Windows 10, MacOS болон Chrome OS үйлдлийн системд зориулсан программ хэлбэрээр ашиглах боломжтой.

Vectr

SVG файлыг өөр яаж нээх вэ? Энэ төрлийн файлуудтай ажиллахын тулд түүнд өгсөн засварлах ажлыг маш сайн гүйцэтгэдэг Vectr программ байдаг. Уг програм нь вектор зургийн бие даасан хэсгүүдийг өөрчлөх, давхаргатай ажиллах, текст болон команд нэмэх, эффект хэрэглэх (жишээлбэл, ил тод байдал, зураас, гадна болон дотоод сүүдэр), градиент, үзэг, шугам болон бусад хэрэгслийг ашиглах. Vectr хэрэгсэл нь үнэ төлбөргүй бөгөөд Windows, Linux болон Chrome үйлдлийн системд зориулсан хувилбарууд байдаг.

Inkscape

Өмнөх хоёр програмаас ялгаатай нь Inkscape нь нэг их танилцуулга шаарддаггүй. Энэ бол хүчирхэг бөгөөд бүрэн дүүрэн юм үнэгүй редактор SVG дүрсээс эхлээд бүрэн хэмжээний дүрслэл хүртэл ямар ч төвөгтэй вектор графикийг засварлах, бүтээхэд ашиглаж болно. Inkscape нь зам, текст, тэмдэглэгээ, давхарга, суваг, градиент, бүтэцтэй ажиллах боломжтой. Мөн растер графикийн векторжуулалт, SVG өнгөний менежмент болон бусад олон зүйлийг дэмждэг.

Дашрамд хэлэхэд, та файлын эх кодыг засварлах замаар SVG-ийн өнгийг өөрчилж болно, гэхдээ үүнийг хийхийн тулд та дор хаяж CSS хэл болон өнгөт кодын талаар үндсэн ойлголттой байх хэрэгтэй. Жишээлбэл, дэлгэцийн агшинд онцолсон кодын блок дахь загварын параметрийг засварласнаар бид цагаан өнгийг улаанаар сольсон. Мэдээжийн хэрэг, хэрэв та SVG-г ямар нэгэн зүйлээр засварлаж байгаа бол Inkscape болон үүнтэй төстэй програмууд.

SVG-г хэрхэн онлайнаар нээх вэ

Хэрэв танд онлайн SVG засварлагч хэрэгтэй бол Boxy SVG, Vectr, Inkscape-ийн вэб хувилбаруудыг ашиглаарай. Ийм хэвлэлүүдийн функциональ багц нь ширээний хувилбаруудтай бараг ижил байдаг. Жишээлбэл, Inkscape програмыг www.rollapp.com/app/inkscape төслийн нэг хэсэг болгон ажиллуулж болно.

Хэрэв та илүү энгийн зүйл хайж байгаа бол sketch.io/sketchpad дээрээс авах боломжтой онлайн вектор засварлагч Sketchpad-ийг туршиж үзээрэй. Sketchpad нь сойз, шугам, сум, команд, клипарт, үзэг, өнгийн харандаа, airbrush, дүүргэх гэх мэт хэрэгслүүдтэй. Давхарга, палитр, градиент бүхий ажил байдаг.

Гэхдээ энэ үйлчилгээ нь SVG зургийг эхнээс нь үүсгэхэд тохиромжгүй боловч чөлөөт хэлбэрийн зургийн функцийг дэмждэг. Редактор нь эхлэгч хэрэглэгчдэд зориулагдсан тул та үүнийг хялбархан олох боломжтой.

SVG-ээс PNG хөрвүүлэгч

Та SVG файлыг зүгээр л хөтчийн цонх руу чирээд энгийн зураг болгон үзэх боломжтой, гэхдээ SVG баримтыг PNG гэх мэт илүү хүртээмжтэй, танил график формат руу хөрвүүлэх шаардлагатай болдог. Хэрэв хөрвөх боломжтой файлуудүнэ төлбөргүй хэрэгслийг ашиглах нь маш их ач холбогдолтой юм SVG2PNG, энэ нь SVG-г PNG руу хөрвүүлэх боломжийг олгодог багц горим. SVG-г PNG болгон хөрвүүлэхийн тулд уг хэрэгслийг ажиллуулж, вектор файлуудыг цонх руу нь чирээд "Эхлүүлэх" дээр дарж үр дүнг авна уу.

Хэрэв та компьютер дээрээ суулгасан бол вирусны эсрэг програм Чадах Компьютер дээрх бүх файл, мөн файл бүрийг тус тусад нь сканнердах. Та файл дээр хулганы баруун товчийг дараад тохирох сонголтыг сонгосноор ямар ч файлыг сканнердаж болно.

Жишээлбэл, энэ зураг дээр үүнийг онцолсон болно my-file.svg файл, дараа нь та энэ файл дээр хулганы баруун товчийг дараад файлын цэснээс сонголтыг сонгох хэрэгтэй "AVG ашиглан скан хийх". Таныг энэ сонголтыг сонгох үед AVG Antivirus програмыг нээж, файлыг вирусыг шалгах болно.

Үүний үр дүнд заримдаа алдаа гарч болно програм хангамжийн буруу суурилуулалт, энэ нь суулгах явцад гарсан асуудалтай холбоотой байж болох юм. Энэ нь таны үйлдлийн системд саад учруулж болзошгүй SVG файлаа зөв програм хангамжтай холбоно уу, нөлөөлсөн гэж нэрлэгддэг "файлын өргөтгөлийн холбоо".

Заримдаа энгийн No Cash GBA (No$GBA)-г дахин суулгах SVG-г Cash GBA (No$GBA)-тай зөв холбосноор таны асуудлыг шийдэж магадгүй. Бусад тохиолдолд файлын холболттой холбоотой асуудал үүсч болно муу програм хангамжхөгжүүлэгч бөгөөд та нэмэлт тусламж авахын тулд хөгжүүлэгчтэй холбоо барина уу.

Зөвлөгөө:Хамгийн сүүлийн үеийн засварууд болон шинэчлэлтүүд байгаа эсэхийг шалгахын тулд No Cash GBA (No$GBA)-г хамгийн сүүлийн хувилбар болгон шинэчилж үзээрэй.

Энэ нь хэтэрхий ойлгомжтой мэт санагдаж болох ч ихэнхдээ SVG файл өөрөө асуудал үүсгэж болзошгүй. Хэрэв та файлыг хавсралтаар хүлээн авсан бол Имэйлэсвэл вэбсайтаас татаж авсан бөгөөд татаж авах процесс тасалдсан (жишээлбэл, цахилгаан тасарсан эсвэл бусад шалтгаанаар), файл гэмтсэн байж болзошгүй. Боломжтой бол SVG файлын шинэ хуулбарыг аваад дахин нээж үзнэ үү.

Болгоомжтойгоор:Гэмтсэн файл нь өмнөх болон одоо байгаа файлд барьцааны хохирол учруулж болзошгүй хортой програмтаны компьютер дээр байгаа тул шинэчлэгдсэн антивирусыг компьютер дээрээ байнга ажиллуулах нь маш чухал юм.

Хэрэв таны файл SVG бол таны компьютер дээрх техник хангамжтай холбоотойхэрэгтэй байж болох файлыг нээх төхөөрөмжийн драйверуудыг шинэчлэхэнэ төхөөрөмжтэй холбоотой.

Энэ асуудал ихэвчлэн медиа файлын төрлүүдтэй холбоотой байдаг, энэ нь компьютер доторх техник хангамжийг амжилттай нээхээс хамаарна, жишээлбэл. дууны карт эсвэл видео карт. Жишээлбэл, хэрэв та аудио файл нээхийг оролдож байгаа боловч нээх боломжгүй бол танд хэрэгтэй байж магадгүй юм дууны картын драйверуудыг шинэчлэх.

Зөвлөгөө:Хэрэв та SVG файлыг нээх гэж оролдвол танд ийм зүйл гарч ирнэ .SYS файлын алдааны мэдэгдэл, асуудал байж магадгүй эвдэрсэн эсвэл хуучирсан төхөөрөмжийн драйверуудтай холбоотойүүнийг шинэчлэх шаардлагатай байна. DriverDoc гэх мэт драйвер шинэчлэх программ хангамжийг ашиглан энэ үйл явцыг хөнгөвчлөх боломжтой.

Хэрэв алхмууд нь асуудлыг шийдэж чадахгүй болТа SVG файлуудыг нээхэд асуудалтай хэвээр байгаа бөгөөд энэ нь үүнээс үүдэлтэй байж магадгүй юм системийн нөөцийн хомсдол. SVG файлуудын зарим хувилбарууд нь ихээхэн хэмжээний нөөц шаарддаг (жишээ нь санах ой/RAM, тооцоолох хүч) компьютер дээрээ зөв нээх. Хэрэв та нэлээд хуучин компьютер ашиглаж байгаа бол энэ асуудал ихэвчлэн тохиолддог. Техник хангамжмөн үүний зэрэгцээ илүү шинэ үйлдлийн систем.

Учир нь компьютер даалгавраа биелүүлэхэд хүндрэлтэй байгаа үед энэ асуудал үүсч болно үйлдлийн систем(болон ажиллаж байгаа бусад үйлчилгээнүүд дэвсгэр) чадна SVG файлыг нээхэд хэт их нөөц зарцуулна. Хадгалсан тоглоомын файлыг нээхээс өмнө компьютер дээрх бүх програмыг хааж үзээрэй. Компьютер дээрээ байгаа бүх нөөцийг сулласнаар та SVG файлаа нээхийг оролдоход хамгийн тохиромжтой байрлалд байх болно.

Хэрэв чи дээр дурдсан бүх алхмуудыг гүйцэтгэсэнтаны SVG файл нээгдээгүй хэвээр байгаа тул та ажиллуулах шаардлагатай байж магадгүй тоног төхөөрөмжийн шинэчлэл. Ихэнх тохиолдолд, техник хангамжийн хуучин хувилбарыг ашиглаж байсан ч боловсруулах хүчин чадал нь ихэнх хэрэглэгчийн програмуудад хангалттай байх болно (хэрэв та 3D дүрслэх, санхүүгийн/шинжлэх ухааны загварчлал гэх мэт CPU-ийн эрчимтэй ажил хийхгүй бол). эрчимтэй мультимедиа ажил). Тиймээс, таны компьютер хангалттай санах ойгүй байх магадлалтай(илүү түгээмэл "RAM" гэж нэрлэдэг, эсвэл RAM) файлыг нээх ажлыг гүйцэтгэх.

Зохиогчоос: SVG зургууд нь бидний дуртай растер формат болох PNG болон JPG шиг тийм ч түгээмэл биш боловч вектор графикийн давуу тал нь улам олон дизайнеруудын анхаарлыг татаж байна. Дизайнерууд өөрсдийн төсөлдөө вектор графикийг улам бүр ашиглаж байна. Өмнө нь бид Adobe Illustrator, Inkscape гэх мэт ширээний программуудыг татаж авах шаардлагатай байсан бол 2017 онд хөтөчөөс гаралгүйгээр вектор график дизайн хийх боломжтой болсон. Хэрэв та үнэгүй SVG засварлагч хайж байгаа бол эдгээр зургаан үнэгүй хэрэгслийг ашиглаж эхлэх боломжтой.

Vectr

Vectr – сайн сонголтэхлэн болон ахисан түвшний SVG хэрэглэгчдэд зориулсан. Интерфэйс нь цэвэрхэн бөгөөд таны ашиглахгүй хэт олон хэрэгслээр дүүрэн биш юм. Редактор нь вектор зураг дээр эхлэгчдэд тохиромжтой. Хэрэглэгч ямар зорилгоор ашиглагдаагүй багаж хэрэгслийн дунд төөрөх ёсгүй. Энэхүү багцад хэд хэдэн хичээл багтсан болно. Та SVG-д шинээр орсон байсан ч хурдан сурах боломжтой.

Гэсэн хэдий ч дээрх бүх зүйл нь Vectr-ийн үйл ажиллагаа муу гэсэн үг биш юм. Энэ нь ердийн зураг үүсгэх бүх үндсэн багцтай: хэлбэр, текст, давхарга, сүүдэр, хүрээ, дэвсгэр гэх мэт. Энэ нь бүрэн хэмжээний ширээний засварлагчтай харьцуулах боломжгүй ч хурдан дизайн, засвар хийхэд хангалттай юм. Та эхнээс нь зураг үүсгэх эсвэл байгаа зургийг байршуулах боломжтой.

Vectr (газрын зураг эсвэл нарийвчилсан диаграм) руу нарийн төвөгтэй зургуудыг ачаалах үед алдаа гарч болзошгүй. Редактор нь нарийн төвөгтэй графикуудыг үргэлж сайн зохицуулдаггүй. Гэхдээ энгийн SVG (дүрс, лого гэх мэт) хувьд энэ засварлагч хангалттай байх болно.

JavaScript. Хурдан эхлэл

Хэрэв орвол онлайн хувилбаруудТанд хэрэгтэй функц байхгүй тул та програмын ширээний хувилбарыг татаж авах боломжтой. Засварлагчийг Windows, Mac, Linux болон Chromebook-д ашиглах боломжтой.

Магадгүй Vectr-ийн хамгийн гайхалтай онцлог бол та Vectr сайтаас шууд зургуудыг холбож, оруулах боломжтой бөгөөд үүнийг үр дүнтэй SVG хост болгодог. Олон үйлчилгээнүүд SVG файлуудыг татаж авахыг хориглодог тул энэ нь ноцтой нэмэлт юм. WP, Medium, Tumblr гэх мэт алсын сайтууд дээр Vectr-аас SVG зургуудыг үзүүлж, шууд SVG ачаалахыг хориглодог боловч алсаас харуулахыг зөвшөөрдөг.

Vectr нь засварлагчийн самбарт вектор графикийг хуваалцах боломжийг олгодог бөгөөд ингэснээр бусад хэрэглэгчид таны үүсгэсэн графикийг өөрчлөх боломжтой болно. Жишээлбэл, та SVG логоны загвар хийж, хэрэглэгчид өөрсдийн хүссэнээр өөрчилж болно. Энэ бүхэн хөтөч дээр байна.

Энэ зорилгоор Vectr саяхан засварлагчийн хувилбарыг хэлбэрээр гаргасан WP-д зориулсан залгаас.

RollApp

Жагсаалтанд орсон бусад хэрэгслүүдээс ялгаатай нь та очих үед нүүр хуудас RollApp, засварлагч таны өмнө нээгддэггүй. RollApp нь програмуудын багц бөгөөд SVG засварлагч нь зөвхөн нэг програм юм. Гайхалтай хэрэгсэл, энэ бол хөтчийн хувилбар юм Inkscape.

RollApp ашиглахын тулд танд бүртгэл хэрэгтэй. Та шинээр бүртгүүлэх эсвэл нэвтэрч болно Google ашиглан, Facebook, Amazon. Маш тохиромжтой, би програмыг харахын тулд мянга мянган шинэ бүртгэл үүсгэхийг үзэн яддаг.

Inkscape хамгийн шилдэг нь! RollApp бол жагсаалтын хамгийн онцлог шинж чанартай програм юм. Та хөтөч дээрээ шууд утгаараа Inkscape ашиглаж байна! Би нарийн ширийн зүйлийг харьцуулж үзээгүй ч энэ програмд ​​давхарга, объект, текст, зам, шүүлтүүр, эффект, өргөтгөл гэх мэт БҮХ Incscape-ийн функцууд байгаа бололтой.

Үйлдлүүд нь програмын серверүүд болон интернетээр хийгддэг тул том файлуудыг хурдан боловсруулдаггүй. Товчхондоо - хэрэв та том, төвөгтэй файлуудыг засварлах шаардлагатай бол RollApp засварлахгүй хамгийн тохиромжтой сонголт, гэхдээ үндсэн багцад ороогүй бусад ажлуудын хувьд энэ засварлагч бусдаас илүү тохиромжтой.

BoxySVG

Хэрэв та SitePoint-г удаан хугацаанд уншиж байгаа бол редакторыг сайн мэддэг байх ёстой BoxySVG, учир нь өнгөрсөн 12 сарын хугацаанд бид түүний тухай аль хэдийн ярьсан. Энэ нь аль хэдийн хийгдсэн тул би нарийвчилсан тойм хийхгүй энэ нийтлэл.

JavaScript. Хурдан эхлэл

Хэрхэн вэб програм үүсгэх практик жишээгээр JavaScript-ийн үндсийг сур.

Хамгийн чухал зүйл бол Алексыг хянаснаас хойш BoxySVG нь кодын шалгагчийг нэмсэн нь вэб хөгжүүлэгчдийн хамгийн хамааралтай SVG хэрэгслүүдийн нэг болсон явдал юм.

Жанвас

Хэдэн жилийн өмнө Жанвасмаш алдартай SVG редактор байсан. Харамсалтай нь Сүүлийн үедЭнэ засварлагчийг хөгжүүлээгүй байгаа ч энэ нь одоо ч ажиллаж байна. Вэб урагшилж байгаа ч Жанвас зогсонги байдалд орсон тул сонирхол нь бүдгэрчээ. SitePoint-ийн Алекс 2013-14 онд (төлбөртэй хувилбарыг оруулаад) энэ хэрэгсэлтэй бага зэрэг ажилласан бөгөөд Google+ хуудсан дээр хэсэг хугацаанд асуултанд хариулсан. Жанвас бол нэлээд хүчирхэг хэрэгсэл байсан.

Жанвасын гол асуудал нь жаахан хуучирсан. Хөтөчүүд хөгжиж, хөтчүүдийг дагадаггүй програмууд өдөр бүр тогтворгүй болдог. Janvas нь хэлбэр дүрс, текст, зургийн хэрэгсэл, зам, маск, давхарга гэсэн олон онцлогтой. Гэсэн хэдий ч форум дээрх хэрэглэгчид эдгээр функцүүдийн ихэнх нь хүссэн үр дүнг авчрахгүй гэж хэлдэг.

Сайн мэдээ байна - шинэ хувилбар нь Chrome програмын хэлбэрээр гарах болно. Тэд асуудлыг засна гэж найдаж байна.

SVG зурах

Та үнэгүй онлайн SVG засварлагчийг аль хэдийн сонгосон байж магадгүй. Үгүй бол цаашаа яв. SVG зурахнь олон функц бүхий бүрэн нийцтэй SVG засварлагч юм. Энэ програмын загвар нь үнэхээр вэбэд зориулагдсан бөгөөд хөтөч дээр ширээний програмын порт шиг харагдахгүй байгаа нь надад үнэхээр таалагдаж байна. Цэс нь зүүн талд байрладаг; дарснаар хоёр дахь түвшний цэс нээгдэнэ гэх мэт.

DrawSVG-ийн тусламжтайгаар та объектыг зурах, өөрчлөх, дүрслэх боломжтой. Та энгийн дүрс зурж болно, Bezier муруй, шулуун ба муруй текст, зураас, дүүргэлтийн олон хэв маяг гэх мэт. Мөн SVG-г PNG руу экспортлох боломжтой.

SVG-засварлах

SVG-засварлах- өвөө онлайн редакторуудвектор график 2000-аад оны дундуур гарч ирсэн. Серверийн функц байхгүй, бүх зүйл хөтөч дээр ажилладаг. Өөрийнхөө функцийг нэмэхгүйгээр ажлаа хадгалах боломжгүй юм.

Гэсэн хэдий ч амьдрал нь маш хязгаарлагдмал, ойлгомжгүй вектор зурах програмаар эхэлсэн редакторын хувьд SVG-edit-ийн үйл ажиллагаа байнга сайжирсаар ирсэн.

SVG-edit ашиглан та энгийн дүрс (шугам, тэгш өнцөгт, тойрог, олон өнцөгт, чөлөөт шугам гэх мэт) зурах, зам, давхарга, градиент ашиглах, SVG эх сурвалжийг харах, засах, PNG, JPEG, BMP, WEBP руу экспортлох, гэх мэт.

Дүгнэлт

Эдгээр 6 SVG засварлагчаас гадна бусад нь байдаг боловч цөөхөн нь дээр үзүүлсэн таваас илүү функцийг санал болгодог.

Хэрэв та SVG-ийн талаар нухацтай хандахыг хүсч байгаа бөгөөд эдгээр хэрэгслүүд нь танд хэрэгтэй функцгүй бол та үргэлж Illustrator эсвэл Inkscape гэх мэт ширээний SVG засварлагчийг татаж авах боломжтой. Гэсэн хэдий ч хялбар, хурд, уян хатан байдлын үүднээс дээрх бүх редакторууд нь ашигтай функцуудыг санал болгодог.

Жич: Та бас оролдож болно Зураг. Энэ нь SVG засварлагчаас илүү UI үүсгэх хэрэгсэл юм. Гэсэн хэдий ч энэ нь маш сайн хэрэгслүүдтэй бөгөөд оновчтой SVG кодыг үүсгэдэг.