نظام الإحداثيات لـ SVG

مثل العديد من أنظمة الإحداثيات التي يستخدمها الرسم الحاسوبي، يستخدم SVG أيضًا نظام الإحداثيات الشبكي. لهذا النظام عدة خصائص: يُعتبر الزاوية العلوية اليسرى نقطة البداية للنظام الإحداثي (0,0) ويكون اتجاه المحور x إلى اليمين، يبدأ من نقطة 0,0 ويُزيد x تدريجياً. يُعتبر اتجاه المحور y إلى الأسفل، يبدأ من نقطة 0,0 ويُزيد y تدريجياً. يتم التعبير عن الإحداثيات بالبكسل

نظام الإحداثيات للSVG (ومعظم الرسومات الحاسوبية الأخرى) يختلف قليلاً عن نظام الإحداثيات الرياضية والرسومات إلخ.

　الرياضيات/نظام الإحداثيات الكارتيزي

في نظام الإحداثيات المثلثي، النقطة x=0،y=0 تقع في الزاوية السفلية اليسرى من الرسمة. مع زيادة x، تنقل النقطة في النظام الإحداثي إلى اليمين. عند تقليل x، تنقل النقطة في النظام الإحداثي إلى اليسار. مع زيادة y، تنقل النقطة في النظام الإحداثي إلى الأعلى. عند تقليل y، تنقل النقطة في النظام الإحداثي إلى الأسفل.

هذه هي رسمة نظام الإحداثيات للرسومات العادية، في الزاوية السفلية اليسرى 0,0:

نظام الإحداثيات SVG

في نظام الإحداثيات SVG، النقطة x=0،y=0 هي الزاوية العلوية اليسرى. لذلك، بالمقارنة مع نظام الإحداثيات الشائع للرسومات، تكون المحور y عكسية. مع زيادة y في SVG، تنقل النقاط والشكلات إلخ إلى الأسفل وليس إلى الأعلى.

هذه هي رسمة نظام الإحداثيات SVG، في الزاوية العلوية اليسرى 0,0:

وحدة نظام الإحداثيات

يمكن تحديد وحدة واحدة في نظام الإحداثيات SVG. يمكنك تنفيذ هذه العملية في أي مكان يمكنك تحديد الإحداثيات (موقع x و y، عرض وارتفاع، إلخ). يمكنك تحديد الوحدة بعد القيمة، مثل 10cm أو 125mm.

إذا لم يتم تحديد أي وحدة بعد قيمة الإحداثيات، يتم افتراض الوحدة كـ بكسل(px).

هذه قائمة الوحدات التي يمكن استخدامها مع عناصر SVG:

<svg> في properties width و height، وحدة القياس المحددة في العنصر تؤثر فقط على العنصر <svg> (النافذة البصرية). يجب تعيين وحدة القياس الخاصة للشكل الموجود داخل العنصر <svg>. كما أنه إذا لم يتم تحديد وحدة القياس، فإن الوحدة الافتراضية هي البكسل.