آموزش SVG
آموزش SVG
SVG سرنام واژگان Scalable Vector Graphics است و به معنی گرافیک برداری مقیاس پذیر است.
SVG بر پایه ی گرافیک های برداری مقیاس پذیر استوار است.
SVG گرافیک های برداری را به فرمت XML تعریف می کند.
آموزش به همراه مثال ها
با استفاده از ادیتور خودتان امتحان کنید، می توانید کدهای SVG را ویرایش کنید و با کلیک بر روی یک دکمه، نتیجه را مشاهده کنید.
مثالی از SVG
<body>
<h1>My first SVG</h1>
<svg width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</body>
</html>
پیش نیازها و آنچه که باید از قبل بدانید
قبل از ادامه ی این مطالب، شما باید یک درک متوسط از موضوعات زیر داشته باشید:
- HTML
- XML مقدماتی
در صورتی که می خواهید موضوعات ذکر شده را مطالعه کنید، می توانید آنها را در صفحه ی نخست پیدا کنید.
SVG چیست؟
- SVG بر پایه ی گرافیک برداری مقیاس پذیر استوار است.
- از SVG برای ایجاد گرافیک های برداری برای وب استفاده می شود.
- SVG گرافیک های خود را به فرمت XML تعریف می کند.
- اگر روی گرافیک های SVG زوم شود و یا این گرافیک ها را تغییر اندازه دهیم، به هیچ وجه از کیفیت آنها کاسته نمی شود.
- تمامی عناصر و خصوصیات در فایل های SVG می توانند متحرک سازی شوند.
- SVG توسط W3C توصیه و پیشنهاد شده است.
- SVG با دیگر استاندارد های W3C مانند DOM و XSL به خوبی کار می کند.
SVG توسط W3C توصیه شده است
در تاریخ 4 سپتامبر 2001، SVG 1.0 توسط W3C توصیه شده است.
نسخه ی 1.1 از SVG در تاریخ 14 ژانویه 2003، توسط W3C توصیه شده است.
ویرایش دوم نسخه ی 1.1 از SVG در تاریخ 16 آگوست 2011 توسط W3C توصیه شده است.
مزیت های SVG
برتری های SVG نسبت به دیگر فرمت های عکس(مانند JPEG و GIF) عبارتند از:
- عکس های SVG را می توان به هر ادیتور متنی ایجاد و ویرایش کرد.
- عکس های SVG را می توان مورد جستجو قرار داد، ایندکس کرد، و یا فشرده سازی نمود.
- عکس های SVG مقیاس پذیر هستند.
- عکس های SVG را می توان با بهترین کیفیت و در هر رزولوشن ای چاپ نمود.
- عکس های SVG دارای قابلیت زوم و بزرگنمایی بدون افت کیفیت هستند.
- SVG یک استاندارد متن باز است.
- فایل های SVG درواقع XML خالص هستند.
اصلی ترین رقیب SVG، همان Flash است.
برترین مزیت SVG نسبت به Flash، انطباق آن با دیگر استانداردها است( مثلا انطباق با XSL و DOM). در ضمن Flash از تکنولوژی استفاده می کند که متن باز نیست.
ایجاد عکس های SVG
عکس های SVG می توانند به وسیله ی هر ادیتور متنی ایجاد شوند. اما این راحت تر است که برای ایجاد عکس های SVG از یک نرم افزار ترسیم کننده، مثل Inkscape استفاده کنید.
- نوشته شده توسط احسان عباسی
- بازدید: 19579
دیدگاه‌ها
سلام دوستان
میخام با svg یک درخت چندتایی طراحی کنم که امکان اضافه کردنن نود داشته باشه
میشه کمکم کنید.