محول مجاني

تحويل PNG إلى SVG متجهات

قم بتحويل صور PNG و JPG النقطية إلى رسومات SVG المتجهة القابلة للتحجيم. كل ذلك بشكل آمن وسريع داخل متصفحك.

اسحب وأفلت صور PNG/JPG هنا

يدعم حتى 50 ميغابايت

أو

حول هذه الأداة

يعد تحويل PNG إلى SVG في الأساس عملية تتبع، وليس تغييرًا في التنسيق. PNG يخزن البكسلات؛ يقوم SVG بتخزين الأوليات الهندسية. يتطلب الانتقال من شبكة البكسل إلى مسارات المتجهات القابلة للتحجيم تفسير الصورة النقطية ورسم أشكال تقريبية حول مناطق ذات ألوان مماثلة. والنتيجة قابلة للتطوير بشكل حقيقي - يمكنك تغيير الحجم بحرية دون الحاجة إلى البيكسل - ولكنها ليست نسخة مثالية للمصدر. يتم تتبع محتوى الصور الفوتوغرافية بشكل سيئ لأن كل اختلاف لوني على مستوى البكسل يتحول إلى شكل، مما ينتج عنه صور SVG ضخمة تتعارض مع الغرض. يتم تتبع الشعارات والأيقونات والفن الخطي والرسومات عالية التباين بشكل واضح لأنها تحتوي على عدد صغير من مناطق الألوان ذات الحدود المحددة جيدًا.

يستخدم هذا المحول مكتبة imagetracerjs، وهو منفذ JavaScript لخوارزميات تتبع المتجهات المشابهة لـ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 بأربعة ألوان يتم رسمه في أقل من ثانية؛ قد تستغرق الصورة مقاس 1024 × 1024 ذات 16 لونًا عدة ثوانٍ.
  4. قم بتنزيل ملف SVG: احفظ ملف SVG على جهازك. يحتوي الملف على علامة XML مع عناصر المسار؛ يمكنك فتحه في أي محرر نصوص لفحص النتيجة أو ضبطها يدويًا.

حالات الاستخدام الشائعة

التفاصيل الفنية

تطبق imagetracerjs مسارًا متعدد المراحل: يؤدي تكميم الألوان إلى تقليل الصورة النقطية إلى عدد ثابت من الألوان باستخدام التجميع أو القطع المتوسط؛ يحدد اكتشاف الحافة حدود البكسل بين المناطق؛ يتبع تتبع الكفاف الحدود لإنتاج مضلعات مغلقة؛ يؤدي تركيب الخط والمنحنى إلى تقريب المضلعات ذات منحنيات Bezier لتقليل بيانات المسار.

معلمات الخوارزمية الأكثر أهمية هي عدد الألوان (نموذجي: 4-32)، والباتوميت (يتم تجاهل المسارات الأقصر من هذا العدد من البكسلات كضوضاء)، ولترس (تسامح الخط - إلى أي مدى يمكن أن تنحرف الحافة قبل تقسيمها إلى مقطع جديد)، و qtres (تسامح المنحنى التربيعي - مدى تنعيم المنحنيات بقوة). تعمل الإعدادات الافتراضية بشكل جيد مع الشعارات؛ تستفيد الصور المعقدة من ضبط كل صورة.

الإخراج هو SVG 1.1 قياسي مع عناصر المسار. تصبح كل منطقة لون مسارًا واحدًا بسمة تعبئة. يتم فتح الملف الناتج في أي متصفح، أو محرر متجه، أو أداة تصميم متوافقة مع SVG. يعتمد حجم الملف بشكل أساسي على عدد المسارات وكثافة العقدة؛ الشعار النموذجي الذي يتم تتبعه هو 1-10 كيلو بايت.

أفضل الممارسات

الأسئلة الشائعة

هل سيكون إخراج SVG ملفًا متجهًا حقيقيًا؟
تقوم الأداة بتتبع الصورة النقطية لإنشاء مسارات متجهة. تعمل النتائج بشكل أفضل مع الرسومات والشعارات والرسومات الخطية البسيطة. ستنتج الصور مسارات معقدة وقد لا تبدو كما هو متوقع.
ما الذي يجعل SVG مختلفًا عن تنسيقات الصور الأخرى؟
SVG هو تنسيق متجه — يتم وصف الصور على أنها أشكال رياضية بدلاً من وحدات البكسل. وهذا يعني أن ملفات SVG يمكن تغيير حجمها إلى أي حجم دون فقدان الجودة، وعادةً ما تكون أصغر بكثير من الصور النقطية للرسومات مثل الشعارات والأيقونات.
هل هناك أي قيود يجب أن تكون على علم بها؟
يتم دعم الملفات التي يصل حجمها إلى 50 ميجابايت. قد تستغرق معالجة الملفات الكبيرة أو المعقدة وقتًا أطول. تتم جميع التحويلات في متصفحك، لذا تعتمد سرعة المعالجة على جهازك.
هل تظل صوري خاصة أثناء التحويل؟
نعم. تتم معالجة ملفات PNG الخاصة بك بالكامل داخل متصفحك باستخدام Canvas API وJavaScript. لا يتم تحميل أي شيء على أي خادم — ينتقل الملف مباشرة من جهازك إلى المحول ثم يعود إلى جهازك.
هل التتبع قابل للتحرير في Illustrator أو Inkscape؟
نعم. الإخراج هو SVG قياسي مع عناصر المسار. يقوم كل من Illustrator وInkscape بفتحه محليًا ويتيح لك تحرير المسارات وتغيير الألوان وتحسين النتيجة.
هل تم تحميل ملف PNG الخاص بي إلى خادم؟
لا، يتم التتبع في متصفحك باستخدام imagetracerjs. الملف لا يترك جهازك.
لماذا ملف SVG الخاص بي ضخم؟
عادةً لأن الصورة المصدر تحتوي على عدد كبير جدًا من الألوان أو الكثير من التفاصيل الدقيقة. حاول تقليل عدد الألوان، أو زيادة تبسيط المسار، أو استخدام صورة مصدر مختلفة ذات هندسة أكثر وضوحًا.
هل يمكنني تتبع PNG بشفافية؟
نعم. تصبح وحدات البكسل الشفافة مناطق بدون مسارات في SVG. يتم الاحتفاظ بالخلفية الشفافة عند عرض SVG على أي لون خلفية.