رسوميات شعاعية قابلة للتمديد

عودة للموسوعة
Scalable Vector Graphics
الشعار
امتداد الملف
svg، svgz
صيغة وسائط الإنترنت
image/svg+xml
نوع الصيغة
رسوميات شعاعية
المطور
W3C
أول إصدار
4 سبتمبر 2001; منذ 18 سنة (2001-09-04
امتدّ لـ
لغة الرقم القابلة للامتداد
المعايير
W3C SVG
صيغة مفتوحة?
Yes
مسقط الويب
[/]

الرسوميات الشعاعية قابلة للتمديد، تلفظ [إس ڤي جي] هونسق لترميز الرسوميات الشعاعية، والاختصار (SVG) (بالإنجليزية: Scalable Vector Graphics)‏ وتعني "الرسوميات الشعاعية القابلة للتمديد". هونسق قياسي (وإمتداد .svg لأسماء للملفات المتسقة معه) يعتمد على ترميز الرسوميات الشعاعية باستخدام لغة الترميز القابلة للامتداد (xml) الوصفية. والرسومات الشعاعية تعتمد وصف الخطوط والمساحات بإستخدام إحداثياتها في لقاء الطريقة المتبعة في نسق الصور النقطية والتي يتم فيها ترميز الصورة على أنها خانات لونيّة؛ جميع منها عنصورة (بكسل) موصوفة الألوان تكوّن معا الصورة كتنظيم مستطيلي فسيفسائي، ومن أمثلة النسق الصور النقطية جيه بيه إيه جي (jpeg) وجي آي إف (gif) . وبسبب حتى الرسم المتجهي وصف للخطوط والمساحات، فإن ذلك يسمح بعرض الرسوم بأبعاد كبيرة أوصغيرة والإبقاء على دقة عالية للرسم والتعديل عليها برمجيا بشكل أسلس أوترجمة النصوص المضمنة فيه، ويمكن بهذا النسق -إلى جانب تخزين رسوم موصوفة- تخزين بيانات صور نقطية و\أونصوص. طور هذا النسق مَجمَع شبكة الويب العالمية (W3C).


الرسم بالنصوص البرمجية

يعتمد هذا النسق على وصف الرسمة بلغة تحدد إحداثيات وألوان للخطوط والمساحات، الوصف أدناه مثلا ينتج النجمة الظاهرة على اليسار:


<?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg>
 <svg xmlns="http://www.w3.org/2000/svg"
      width="304" height="290">
   <path d="M2,111 h300 l-242.7,176.3 92.7,-285.3 92.7,285.3 z" 
      style="fill:#FB2;stroke:#BBB;stroke-width:15;stroke-linejoin:round"/>
</svg>

تاريخ

هذه هي تماما التحديات التي تعمل مجموعة SVG (Scalable Vector Graphics) ضمن اتحاد الويب W3C على حلّها. وتتألف هذه المجموعة من ممثلي شركات كبرى مثل أدوبي، وأبل، وكوريل، وهوليت-باكارد، وأي بي أم، وماكروميديا، ومايكروسوفت، وصن مايكروسيستمز، وزيروكس، وغيرها من الشركات. وتهدف هذه المجموعة، وباستخدام لغة XML إلى إنتاج نوع حديث من الرسوم للويب، هذه الرسوم لا تعتمد البكسلات في تشكيلها، ولكنها رسوم وصفية تعتمد الكود. وبحدثات أخرى ستقوم هذه اللغة القياسية والعمومية بتوصيف جميع عناصر الصور والفلاتر والخطوط من خلال الكود بحيث يمكن للمستخدمين الحصول على رسوم معقدة ذات دقة عرض عالية دون استهلاك الكثير من سعة الموجة.

ما هوالمميز في SVG

الفرق بين رسوم bitmap (يسار) ورسوم SVG (يمين)

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

ولأن لغة SVG تقوم بوصف العناصر باستخدام الخطوط والمنحنيات، فإنها تتطلب كمية أقل بكثير من سعة الموجة مقارنة بأنساق الصور المستخدمة حاليا (JPGأوGIF) والتي يجب حتى يتم نقل جميع بكسل بها كي يتم عرضها بصورة كاملة. وبالإضافة إلى هذه الميزة الهامة، فإن هذه الصور، والموصوفة باستخدام المتجهات، تسمح للمستخدم بتكبير الصور أوتصغيرها zooming دون فقدان أي تفصيل من تفاصيل الصور. وأقرب مثال على ذلك هوما نراه في رسوم فلاش، ولكن الرسوم التي تستخدم نسق SVG ستحتوي على قدرات مضمنة أفضل بكثير من رسوم فلاش.

ومن فوائد نسق SVG الأخرى، مقارنة بنسق GIF مثلا، هي حتى لوحة الألوان palette لهذا النسق تدعم عرض 16 مليون لون، مع دعم تام لسجلات الألوان color profiles (وذلك لضمان ظهور الألوان كما هي عند استعراضها باستخدام أدوات، أومتصفحات مختلفة). كما أنه يمكن الحصول على نسخ من الصور عند طباعتها من الطابعات المخطية مماثلة في دقتها لما يراه المستخدم على الشاشة، ولن يرى المستخدم أية من النتوءات التي يحصل عليها من الصور التي تستخدم تقنية bitmap.

ولكن أفضل ميزة في الرسوم التي تستخدم نسق SVG هوإمكانية إنشاء الرسومات بسرعة باستخدام لغة برمجة نصية ومصدر للبيانات. ففي حالة المثال الذي ذكرناه في المقدمة يمكن باستخدام عناصر XML التي تقوم بوصف رسوم SVG، كتابة نص برمجي يقوم بعرض نتائج فريق المبيعات على شكل رسوم بيانية (سواء ثنائية أوثلاثية الأبعاد)، وذلك بشكل تلقائي دون أي تدخل بشري. ويمكنكم حتى تتخيلوا مثلا استخدام هذا النسق في مشاريع البناء مثلا، فإذا كان برنامج الرسوم الهندسية الذي تستخدمه (مثل أوتوكاد) مرتبطا بالويب، فإنه يمكن لك أنت وزملاؤك في المخط، والعميل، والمقاول، حتى تتعاونوا بنشر المخطط الهندسي على مسقط إنترنت خاص بالمشروع، وبمجرد إدخال تغيير على أبعاد البناء ضمن ملف المشروع في أوتوكاد، فإن كافة المخططات الهندسية الخاصة بالمشروع على المسقط تتغير لتتكيف مع هذا التعديل. ولا حدود هنا للأفكار والإمكانيات التي تتيحها هذه التقنية للعمل من خلال إنترنت.

لغات سابقة

في عام 1998، تقدمت جهات إلى اتحاد الويب باقتراحين يتعلقان بعرض الرسوم على إنترنت، كان الأول هولغة VML (لغة تعليم المتجهات)، وPGML (لغة تعليم الرسوم الدقيقة)، وهاتان اللغتان هما إحدى تطبيقات XML وتستخدمان سمات أنماط CSS.

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

ويحرص اتحاد الويب على التأكيد بأن هذه اللغة عمومية وقياسية، بمعنى أنها لا تنتمي إلى شركة أومؤسسة معينة، وهي متاحة لكل من يريد استخدامها ضمن تطبيقاته، كما حتى اتحاد الويب حرص عند اعتماده لهذا المقياس على حتىقد يكون متوافقا مع كافة المقاييس الأخرى التي اعتمدها الاتحاد.

مرونة في عرض الرسوم ونشرها

أفضل ما في اللغات المشتقة من XML هوأنها تفصل ما بين المحتوى والشكل الذي يتم عرضه به، وهي بذلك تختلف عن لغة HTML، والتي على الرغم من اعتمادها الأسلوب الهيكلي في تعليم النص، فإنه يمكن استخدامها أيضا في عرض النص. أما شيفرة XML فيمكن استخدامها كأساس لعرض النص، أوكبيانات يمكن استخدامها في تطبيق آخر.

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

ولأن مقياس SVG متوافق مع نموذج الوثائق العناصرية Document Object Model، وهوالمقياس الذي تعتمد عليه كافة المقاييس التي يطلقها اتحاد الويب، فإن رسوم SVG قابلة للبرمجة، بمعنى أنه يمكن للمستخدم حتى يتفاعل مع هذه الرسوم، كما أنه يمكن لتغييرها حتى يؤدي إلى إحداث تغييرات في العناصر الأخرى على صفحات الويب. ويمكن استعمال دوال مثل onmouseover، وonmouseout، وonload، وonfocus، مع الملفات والرسوم التي تستخدم نسق SVG.

ونسق SVG متوافق عكسيا، بمعنى أنه تقدر إضافة علامة ALT إلى الصورة مما يسمح للمتصفحات القديمة بعرضها بنسق GIF أوJPG. شركة أدوبي قامت بطرح ملحقين برمجيين تجريبيين لأجهزة الماكنتوش وويندوز، كما قامت أي بي أم بعرض ملحقين يمكن بواسطتهما استعراض الرسوم بنسق SVG ضمن نظام ويندوز. وقامت شركة Csiro بطرح حزمة برمجية تتضمن مستعرضا لرسوم SVG، وأداة لتحويل الرسوم بهذا النسق إلى عدد من الأنساق الأخرى، وهذه الحزمة مكتوبة بلغة جافا وتحتاج إلى وجود جافا 1.2 أوأعلى، وهذه الحزمة عمومية المصدر Open source ويمكن للمبرمجين الحصول على شيفرتها المصدرية وبالتالي تضمين التقنية في برمجياتهم.

هل يمكن حماية رسوم SVG

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

النص العربي في رسوم SVG

بما أنه يمكن تضمين النص في رسوم SVG فهل يمكن تضمين النص العربي مثلا ضمن هذه الرسوم،يا ترى؟ الإجابة على هذا السؤال هي أنه يمكن تضمين أي من النصوص المدعومة ضمن لوحة محارف يونيكود ضمن رسوم SVG. ويمكن إدخال هذه النصوص بشكل مباشر، باستخدام محرر نصوص يدعم محارف يونيكود، أويمكن إدخالها باستخدام الأرقام التي تشير إليها ضمن لوحة المحارف. ويمكن للمثال التالي حتى يوضح الكيفية التي يمكن بها عرض النص العربي مثلا، شريطة توفر الخط المستخدم.

<text x="2.5cm" y="1.5cm"><tspan style="font-family:Simplified Arabic">This</tspan> <tspan style="font-family:Arabic">ל</tspan><tspan style="font-family:Simplified Arabic">SVG.</tspan></text>

مثال على رسوميات متجهية متغيرة تحتوي على نص عربي

طالع أيضا

  • إنكسكيب

مراجع

  1. ^ (w3.org ref)
  2. ^ (ietf.org ref)
  3. ^ "IRC log of svg on 2008-11-17". W3C. 2008. مؤرشف من الأصل فيعشرة أكتوبر 2016. اطلع عليه بتاريخ 25 مايو2009. DS: Priorities should be layout, diffusion curves, 2.5D and make sure we work well with CSS on that
  4. ^ Clarke, Gavin (3 June 2009). "Google to slip SVG into Internet Explorer". The Register. The Register. مؤرشف من الأصل في 11 مارس 2014. اطلع عليه بتاريخ 11 مارس 2014.
  5. ^ Orzan, Alexandrina; Bousseau, Adrien; Winnemöller, Holger; Barla, Pascal; Thollot, Joëlle; Salesin, David (2008). "Diffusion Curves: A Vector Representation for Smooth-Shaded Images" (PDF). ACM Transactions on Graphics (Proceedings of SIGGRAPH 2008). 27. مؤرشف من الأصل (PDF) في 13 نوفمبر 2018. اطلع عليه بتاريخ 25 مايو2009.
  6. ^ "Scalable Vector Graphics (SVG) 1.1 (Second Edition)". www.w3.org. مؤرشف من الأصل في 29 مارس 2019. اطلع عليه بتاريخ 16 يناير 2018.

وصلات خارجية

  • برنامج إنكسكيب لتحرير الرسوميات المتجهية القياسية
تاريخ النشر: 2020-06-01 19:10:24
التصنيفات: رسوميات شعاعية قابلة للتمديد, أنساق ملفات الحاسوب, اختراعات متعلقة بالحواسيب في 2001, إتش تي إم إل 5, صيغ ملفات الرسوميات, معايير رابطة الشبكة العالمية, صفحات تستخدم خاصية P1195, صفحات بها بيانات ويكي بيانات, صفحات تستخدم خاصية P144, صفحات تستخدم خاصية P154, مقالات تحتاج إلى صور, مقالات تحتوي نصا بالإنجليزية, بوابة صور رقمية/مقالات متعلقة, بوابة إنترنت/مقالات متعلقة, بوابة برمجيات/مقالات متعلقة, جميع المقالات التي تستخدم شريط بوابات, صفحات تستخدم خاصية P244, صفحات تستخدم خاصية P227, صفحات تستخدم خاصية P268, قالب تصنيف كومنز بوصلة كما في ويكي بيانات

مقالات أخرى من الموسوعة

سحابة الكلمات المفتاحية، مما يبحث عنه الزوار في كشاف:

آخر الأخبار حول العالم

ألمانيا تسجل 34145 إصابة جديدة بكورونا و30 وفاة

المصدر: اليوم - السعودية التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:33:08
مستوى الصحة: 60% الأهمية: 66%

عام / فرع وزارة الشؤون الإسلامية بعسير ينفذ 7764 جولة تفقدية على مساجد المنطقة

المصدر: وكالة الأنباء السعودية - السعودية التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:31:41
مستوى الصحة: 53% الأهمية: 56%

«رويترز» تبرز توقعات هيئة قناة السويس بارتفاع إيراداتها هذا العام

المصدر: موقع الدستور - مصر التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:21:56
مستوى الصحة: 51% الأهمية: 53%

حياة كريمة.. الإنتهاء من 17مشروعا بسوهاج بتكلفه مليار و253 مليون جنيه

المصدر: اليوم السابع - مصر التصنيف: غير مصنف
تاريخ الخبر: 2022-01-17 06:24:02
مستوى الصحة: 35% الأهمية: 50%

ثروات أغنى 10 رجال في العالم تضاعفت خلال الجائحة

المصدر: صحيفة الإقتصادية - السعودية التصنيف: إقتصاد
تاريخ الخبر: 2022-01-17 06:23:04
مستوى الصحة: 36% الأهمية: 43%

أجواء باردة في توقعات طقس غدا الاثنين

المصدر: كِشـ24 - المغرب التصنيف: سياسة
تاريخ الخبر: 2022-01-17 07:10:26
مستوى الصحة: 31% الأهمية: 43%

اليوم.. محاكمة المتهم باغتصاب جثة فتاة وحرق مقبرتها فى حلوان

المصدر: موقع الدستور - مصر التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:21:55
مستوى الصحة: 54% الأهمية: 64%

«الغذاء العالمي» ينهي تعليق أنشطته بشمال دارفور

المصدر: صحيفة التغيير - السودان التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:26:08
مستوى الصحة: 48% الأهمية: 59%

حبة «الغلة» تنهي حياة 7 أشخاص في 10 أيام - أخبار السعودية

المصدر: صحيفة عكاظ - السعودية التصنيف: مجتمع
تاريخ الخبر: 2022-01-17 06:29:02
مستوى الصحة: 48% الأهمية: 65%

متغير جيني يحمي حامليه 20% من العدوى الشديدة بـ «كورونا»

المصدر: الإمارات اليوم - الإمارات التصنيف: مجتمع
تاريخ الخبر: 2022-01-17 06:19:11
مستوى الصحة: 56% الأهمية: 69%

سحب رعدية ممطرة على عسير حتى الـ 6 مساءً

المصدر: صحيفة اليوم - السعودية التصنيف: مجتمع
تاريخ الخبر: 2022-01-17 06:32:46
مستوى الصحة: 41% الأهمية: 49%

عادات غذائية سيئة يجب التخلى عنها فورًا

المصدر: موقع الدستور - مصر التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:23:05
مستوى الصحة: 47% الأهمية: 66%

كوريا الجنوبية تسجل أقل من 4 آلاف إصابة بكورونا

المصدر: مصراوى - مصر التصنيف: غير مصنف
تاريخ الخبر: 2022-01-17 06:24:22
مستوى الصحة: 60% الأهمية: 52%

الكورونا تحتضر، إن شاء الله، «وسنعبر وسننتصر»..

المصدر: صحيفة التغيير - السودان التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:26:11
مستوى الصحة: 54% الأهمية: 70%

دراسة أمريكية: عصير الرمان يعد الأمثل لمرضى السكر

المصدر: موقع الدستور - مصر التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:22:58
مستوى الصحة: 45% الأهمية: 63%

الإحصاء: 10.7 مليار دولار واردات مصر من الصين خلال 10 أشهر

المصدر: موقع الدستور - مصر التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:21:55
مستوى الصحة: 46% الأهمية: 57%

مهرجان لمصارعة الإبل في تركيا يتعرض لانتقادات حقوقية .. «جريمة كبيرة»

المصدر: الإمارات اليوم - الإمارات التصنيف: مجتمع
تاريخ الخبر: 2022-01-17 06:19:12
مستوى الصحة: 52% الأهمية: 61%

تقرير بريطانى يشيد باتجاه مصر لتحويل قناة السويس لممر تجارى أخضر

المصدر: موقع الدستور - مصر التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:21:54
مستوى الصحة: 49% الأهمية: 52%

عام / المركز الوطني للأرصاد : سحب رعدية ممطرة على منطقة عسير

المصدر: وكالة الأنباء السعودية - السعودية التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:31:43
مستوى الصحة: 59% الأهمية: 58%

طائرة ركاب تقلع بمسافر واحد فقط ! - أخبار السعودية

المصدر: صحيفة عكاظ - السعودية التصنيف: مجتمع
تاريخ الخبر: 2022-01-17 06:29:01
مستوى الصحة: 56% الأهمية: 69%

عام / كوريا الجنوبية تسجل 3859 إصابة جديدة بكورونا

المصدر: وكالة الأنباء السعودية - السعودية التصنيف: سياسة
تاريخ الخبر: 2022-01-17 06:31:46
مستوى الصحة: 49% الأهمية: 66%

اكتشاف «عميل» مسؤول عن فتح خلايا الجسم لدخول «كورونا»

المصدر: الإمارات اليوم - الإمارات التصنيف: مجتمع
تاريخ الخبر: 2022-01-17 06:19:09
مستوى الصحة: 53% الأهمية: 60%

الاقتصاد الصيني ينمو بنسبة 8.1 % في 2021

المصدر: صحيفة الإقتصادية - السعودية التصنيف: إقتصاد
تاريخ الخبر: 2022-01-17 06:23:07
مستوى الصحة: 42% الأهمية: 48%

تحميل تطبيق المنصة العربية