مبدل رایگان

PNG به SVG Vectorizer

تصاویر Raster PNG/JPG را به گرافیک های SVG برداری مقیاس پذیر تبدیل کنید. ایمن، سریع و به طور کامل در مرورگر شما پردازش شده است.

PNG/JPG را اینجا بکشید و رها کنید

تا 50 مگابایت پشتیبانی می کند

یا

درباره این ابزار

تبدیل PNG به SVG اساساً یک عملیات ردیابی است، نه تغییر قالب. PNG پیکسل ها را ذخیره می کند. SVG موارد اولیه هندسی را ذخیره می کند. رفتن از یک شبکه پیکسلی به مسیرهای برداری مقیاس پذیر نیاز به تفسیر بیت مپ و ترسیم اشکال تقریبی در اطراف مناطق با رنگ مشابه دارد. نتیجه واقعاً مقیاس پذیر است - شما می توانید آزادانه بدون پیکسل کردن اندازه را تغییر دهید - اما بازتولید کامل منبع نیست. محتوای عکاسی ردیابی ضعیفی دارد زیرا هر تغییر رنگ در سطح پیکسل به شکلی تبدیل می‌شود و SVGهای عظیمی تولید می‌کند که هدف را شکست می‌دهد. لوگوها، نمادها، هنرهای خطی و گرافیک با کنتراست بالا به‌خوبی ردیابی می‌شوند، زیرا دارای تعداد کمی از مناطق رنگی با مرزهای کاملاً مشخص هستند.

این مبدل از کتابخانه imagetracerjs استفاده می کند که یک پورت جاوا اسکریپت از الگوریتم های ردیابی برداری شبیه به potrace است. PNG به یک بیت مپ RGBA رمزگشایی می شود، بیت مپ با استفاده از یک پالت قابل تنظیم به مناطق رنگی تقسیم می شود، مرز هر منطقه در یک مسیر ردیابی می شود، مسیرها با استفاده از تقریب Bezier ساده می شوند و مسیرهای حاصل به عنوان عناصر مسیر SVG منتشر می شوند. کل خط لوله در مرورگر شما بدون آپلود سرور اجرا می شود.

پارامترهای ردیابی تعادل بین وفاداری و اندازه فایل را کنترل می کنند. رنگ های بیشتر و جزئیات ریزتر یک SVG بزرگتر تولید می کند که بیشتر با منبع مطابقت دارد. رنگ‌های کمتر و ردیابی درشت‌تر، SVG کوچک‌تر با حسی استایل‌تر ایجاد می‌کند. پیش فرض ها برای آرم ها و نمادها تنظیم شده اند. تصاویر پیچیده ممکن است از یک پاس ردیابی با تنظیمات تنظیم شده بهره مند شوند یا به سادگی کاندیدای خوبی برای برداری نباشند.

چرا PNG را به SVG تبدیل کنیم؟

وکتوری کردن یک PNG زمانی مفید است که شما نیاز دارید تصویر را فراتر از وضوح اصلی آن مقیاس کنید. به طور خاص، لوگوها اغلب به صورت PNG با اندازه متوسط ​​به دست می‌آیند و باید بر روی بیلبوردها، نمایشگرهای شبکیه چشم و چاپ‌های با فرمت بزرگ ظاهر شوند. یک ردیابی برداری یک SVG تولید می کند که بدون کاهش کیفیت مقیاس می شود. معامله، وفاداری به پیکسل های اصلی است.

SVG همچنین به طور قابل توجهی فشرده تر از PNG برای گرافیک با رنگ های کم و مناطق مسطح بزرگ است. یک نماد PNG در 256×256 ممکن است 8 کیلوبایت باشد. SVG معادل با دو یا سه رنگ اغلب زیر 1 کیلوبایت است. برای کتابخانه‌های آیکون رابط کاربری که به یک صفحه وب تحویل داده می‌شوند، نسخه‌های برداری اندازه بسته را کاهش می‌دهند و وضوح را در تمام تراکم‌های نمایش بهبود می‌بخشند.

نحوه استفاده

یک PNG را رها کنید، تنظیمات ردیابی را انتخاب کنید، یک SVG ایجاد کنید.

  1. PNG خود را آپلود کنید: فایل را به قسمت آپلود بکشید یا برای مرور کلیک کنید. بهترین نتایج از PNG هایی با لبه های تیز و تعداد کمی رنگ متمایز - آرم ها، نمادها، هنر خط، تصاویر ساده به دست می آید. عکس ها ردیابی ضعیفی دارند و SVG های عظیمی تولید می کنند.
  2. در صورت نیاز گزینه های ردیابی را تنظیم کنید: تعداد رنگ ها تعداد رنگ های متمایز در خروجی را کنترل می کند. ساده‌سازی مسیر (همچنین به آن ltres یا qtres نیز گفته می‌شود) چگونگی هموار کردن زوایای الگوریتم را کنترل می‌کند. دقت بالاتر SVG ها را به منبع نزدیکتر اما با داده های مسیر بیشتر تولید می کند.
  3. ردیابی و پیش نمایش: الگوریتم imagetracerjs از طریق کمی سازی رنگ، تشخیص لبه، ردیابی کانتور و برازش Bezier اجرا می شود. ردیابی مقیاس های زمانی با اندازه تصویر و تعداد رنگ ها. لوگوی 256×256 با 4 رنگ در کمتر از یک ثانیه. یک تصویر 1024×1024 با 16 رنگ ممکن است چند ثانیه طول بکشد.
  4. SVG را دانلود کنید: SVG را در دستگاه خود ذخیره کنید. فایل حاوی نشانه گذاری XML با عناصر مسیر است. می توانید آن را در هر ویرایشگر متنی باز کنید تا نتیجه را بررسی یا تنظیم دستی کنید.

موارد استفاده رایج

جزئیات فنی

imagetracerjs یک خط لوله چند مرحله‌ای را پیاده‌سازی می‌کند: کمی‌سازی رنگ با استفاده از خوشه‌بندی k-means یا برش میانه، بیت مپ را به تعداد ثابتی از رنگ‌ها کاهش می‌دهد. تشخیص لبه مرزهای پیکسل بین مناطق را شناسایی می کند. ردیابی کانتور برای تولید چند ضلعی های بسته از مرزها پیروی می کند. برازش خط و منحنی چند ضلعی ها را با منحنی های Bezier تقریب می کند تا داده های مسیر را کاهش دهد.

پارامترهای الگوریتمی که بیشترین اهمیت را دارند عبارتند از: تعداد رنگ ها (معمولی: 4-32)، pathomit (مسیرهای کوتاه تر از این تعداد پیکسل به عنوان نویز حذف می شوند)، ltres (تحمل خط - اینکه یک لبه تا چه اندازه می تواند قبل از تقسیم شدن به یک بخش جدید منحرف شود) و qtres (تحمل منحنی درجه دوم - منحنی ها چقدر صاف هستند). پیش فرض ها برای لوگوها به خوبی کار می کنند. تصاویر پیچیده از تنظیم هر تصویر بهره می برند.

خروجی استاندارد SVG 1.1 با عناصر مسیر است. هر ناحیه رنگی به یک مسیر با ویژگی fill تبدیل می شود. فایل به دست آمده در هر مرورگر، ویرایشگر برداری یا ابزار طراحی SVG-aware باز می شود. اندازه فایل در درجه اول به تعداد مسیر و چگالی گره بستگی دارد. یک لوگوی معمولی ردیابی شده 1-10 کیلوبایت است.

بهترین شیوه ها

سوالات متداول

آیا خروجی SVG یک فایل برداری واقعی خواهد بود؟
این ابزار تصویر شطرنجی را برای ایجاد مسیرهای برداری ردیابی می کند. نتایج با گرافیک‌های ساده، آرم‌ها و هنرهای خطی بهترین کار را دارند. عکس ها مسیرهای پیچیده ای را ایجاد می کنند و ممکن است آنطور که انتظار می رود به نظر نرسند.
چه چیزی SVG را از سایر فرمت های تصویر متمایز می کند؟
SVG یک فرمت برداری است - تصاویر به جای پیکسل به عنوان اشکال ریاضی توصیف می شوند. این بدان معناست که فایل‌های SVG به هر اندازه‌ای بدون از دست دادن کیفیت مقیاس می‌شوند، و معمولاً برای گرافیک‌هایی مانند لوگوها و نمادها بسیار کوچکتر از تصاویر شطرنجی هستند.
آیا محدودیتی وجود دارد که باید از آن آگاه بود؟
فایل های تا 50 مگابایت پشتیبانی می شوند. پردازش فایل های بسیار بزرگ یا پیچیده ممکن است بیشتر طول بکشد. تمام تبدیل ها در مرورگر شما انجام می شود، بنابراین سرعت پردازش به دستگاه شما بستگی دارد.
آیا تصاویر من در هنگام تبدیل خصوصی نگه داشته می شوند؟
بله. فایل های PNG شما به طور کامل در مرورگر شما با استفاده از Canvas API و جاوا اسکریپت پردازش می شوند. هیچ چیزی در هیچ سروری آپلود نمی شود - فایل مستقیماً از دستگاه شما به مبدل می رود و به دستگاه شما برمی گردد.
آیا ردیابی در Illustrator یا Inkscape قابل ویرایش است؟
بله. خروجی SVG استاندارد با عناصر مسیر است. هر دو Illustrator و Inkscape آن را به صورت بومی باز می کنند و به شما اجازه می دهند مسیرها را ویرایش کنید، رنگ ها را تغییر دهید و نتیجه را اصلاح کنید.
آیا PNG من روی سرور آپلود می شود؟
خیر. ردیابی در مرورگر شما با استفاده از imagetracerjs انجام می شود. فایل از دستگاه شما خارج نمی شود.
چرا فایل SVG من بزرگ است؟
معمولاً به این دلیل که تصویر منبع دارای رنگ های بسیار زیاد یا جزئیات بسیار دقیق است. سعی کنید تعداد رنگ ها را کاهش دهید، ساده سازی مسیر را افزایش دهید، یا از یک تصویر منبع متفاوت با هندسه تمیزتر استفاده کنید.
آیا می توانم یک PNG را با شفافیت ردیابی کنم؟
بله. پیکسل های شفاف به مناطق بدون مسیر در SVG تبدیل می شوند. پس‌زمینه شفاف زمانی که SVG بر روی هر رنگ پس‌زمینه رندر می‌شود، حفظ می‌شود.