دوره آموزش SVG و Canvas

SVG چیست ؟ 

کلمه Svg مختصر شده عبارت گرافیک بردار مقیاس پذیر (Scalable Vector Graphics) است.مقیاس پذیر یعنی بیننده می تواند اندازه تصویر را کم یا زیاد کند بدون اینکه کیفیت کم شود. دلیل این اتفاق این است که گرافیک برداری به وسیله اعداد تعریف می شود نه به وسیله پیکسل. کم وزیاد شدن اندازه تصویر یعنی ضرب و تقسیم اعدادی که شکل های svg را تعریف می کنند. با دوره آموزش svg می توانید کار با این فرمت شگفت انگیز را یاد بگیرید. 

Svg یک فرمت تصویری فوق العاده قدرتمند می باشد. با این فرمت گرافیکی می توانید شکل های خاصی را با زبان XML ایجاد کنید. برای رسم تصاویر برداری دوبعدی از این فرمت استفاده می شود.این فرمت گرافیک برداری برای رسم انواع نمودار ها مفید است. برای نمونه:

دوره آموزش SVG و Canvas

برای گذراندن دوره آموزش کار با svg لازم است زبان HTML را بلد باشید و با زبان Css نیز آشنایی داشته باشید در صورتی که با این دو زبان آشنا نیستید پیشنهاد می شود دوره آموزش جامع و رایگان HTML و دوره آموزش جامع css را بگذرانید. در این دوره با تگ های مهم Svg به طور کامل آشنا خواهید شد و طریقه استفاده از آنها را یاد خواهید گرفت. این دوره به شما کمک می کند که بتوانید اشکال و تصاویر مورد نیاز خود را به وسیله Svg رسم کنید.

در ضمن برای این که بتوانید قسمت Canvas را به خوبی متوجه شوید باید مقدار کمی جاوا اسکریپت بدانید که این را هم میتوانید به صورت رایگان به قسمت های ابتدایی از دوره آموزش جامع جاوا اسکریپت آموزش ببینید.

تفاوت بین SVG و Canvas

SVG در حقیقت یک زبان برای تعریف گرافیک دو بعدی در xml است. Canvas گرافیک دو بعدی رسم می کند اما توسط جاوا اسکریپت.

تگ <svg> برپایه xml کار می کند، این مسئله باعث می شود هر عنصر داخل <svg> در dom قابل دسترس باشد. شما می توانید یک event جاوا اسکریپت را برای هر عنصر داخل آن تعریف کنید.

در تگ <svg>، هر شکل به عنوان یک شی در نظر گرفته می شود. اگر خواص یک شی موجود در svg تغییر کند، مرورگر به صورت خودکار آن رسم شکل را به روز می کند.

Canvas به صورت پیکسل به پیکسل رسم می کند. در canvas پس از رسم گرافیک مرورگر دیگر محتوای داخل canvas را به روز نمی کند. اگر قرار به تغییر موقعیت عنصر canvas باشد باید کل صحنه آن دوباره رسم شود، که این شامل هر شی که داخل آن است نیز می شود.

آخرین اخبار و تخفیف های دوره های وب سایت آرتور را در پیج اینستاگرام آرتور دنبال کنید.ابزار های استفاده شده در این دوره 

ویرایشگر phpstorm2021