حاسبة رسوم بيانية ثلاثية الأبعاد على الإنترنت: الأسطح والمنحنيات البارامترية والمبعثرة (WebGL)
راسم تفاعلي ثلاثي الأبعاد مدعوم بـ WebGL (three.js). اعرض أسطحاً على الصورة z=f(x,y) بدقة قابلة للضبط، أو منحنيات فراغية بارامترية، أو سُحُباً نقطية مبعثرة ثلاثية الأبعاد — مع إضافة النقاط واحدةً واحدة أو لصقها دفعة واحدة. درّب وكبّر وحرّك العرض عبر OrbitControls، وأعد الضبط، وانسخ النقاط المبعثرة، وكل ذلك يعمل محلياً في متصفحك.
دليل حاسبة الرسوم البيانية ثلاثية الأبعاد
الأسطح والمنحنيات البارامترية وسحب النقاط عبر WebGL
تُعرض حاسبة الرسوم ثلاثية الأبعاد ثلاثة أنواع من الكائنات في منفذ عرض WebGL تفاعلي: أسطح z = f(x, y)، ومنحنيات فضائية بارامترية (x(t), y(t), z(t))، وسحب نقطية مبعثرة. بدّل الأوضاع، وأدخل التعبيرات أو النقاط، وأدر المشهد بالفأرة أو اللمس لتفقد الشكل من أي زاوية.
01 اختيار الوضع
في وضع السطح، أدخل z كدالة بـ x وy (مثلاً sin(sqrt(x^2 + y^2))) واضبط نطاقي x وy؛ تتحكم الدقة في كثافة الشبكة. في الوضع البارامتري، أدخل x(t) وy(t) وz(t) كدوال بالمعامل t عبر [tmin, tmax]؛ تتحكم العينات في عدد النقاط التي تعرّف المنحنى. في وضع التبعثر، أضف نقاطاً مفردة (x, y, z) بإدخال الإحداثيات والنقر على +؛ استخدم مسح لإزالة جميع النقاط و× لإزالة واحدة.
انقر واسحب لتدوير الكاميرا، ومرّر للتكبير/التصغير، واسحب بزر الفأرة الأيمن (أو بإصبعين) للتحريك. يُعرض المنظر في متصفحك عبر WebGL ومغلّف بـ ClientOnly فلا يؤثر على عرض الخادم.
- السطح: z = f(x,y)، مُعايَن عبر شبكة مستطيلة
- بارامتري: منحنى يُرسم بينما t تتغير عبر [tmin, tmax]
- تبعثر: سحابة منفصلة من نقاط (x, y, z)
- الدقة/العينات الأعلى تعطي نتائج أنعم على حساب الأداء
تبديل الوضع
- سطحرسم z = f(x, y) عبر شبكة.
- بارامتريرسم منحنى بارامتري x(t)، y(t)، z(t).
- تبعثررسم نقاط ثلاثية الأبعاد مفردة.
أدوات السطح
- z = f(x, y)تعبير الارتفاع بدلالة x وy.
- نطاق x / yيضبط المجال المستطيل المُعايَن للسطح.
- الدقةكثافة الشبكة (24–64)؛ الأعلى أنعم ولكن أبطأ.
أدوات بارامتري
- x(t) / y(t) / z(t)ثلاثة تعبيرات تحدد المنحنى عبر المعامل t.
- tmin / tmaxنطاق المعامل t.
- العيناتعدد النقاط على طول المنحنى (100–2000).
أدوات التبعثر
- حقول x / y / zإحداثيات النقطة الجديدة.
- +يضيف النقطة المُدخلة إلى السحابة.
- مسحيزيل كل النقاط (ويمسح أيضًا مربع الإدخال الجماعي).
- × (على النقطة)يزيل تلك النقطة المفردة.
- bulk text boxالصق أو أدخل عدة نقاط دفعة واحدة، نقطة لكل سطر بصيغة x, y, z مفصولة بفواصل أو مسافات.
- Applyيحلّل مربع الإدخال الجماعي ويستبدل سحابة النقاط.
- Copyينسخ جميع النقاط الحالية كأسطر x, y, z للصقها في مكان آخر.
منفذ العرض
- سحبتدوير/إدارة المشهد ثلاثي الأبعاد.
- تمريرتكبير الكاميرا وتصغيرها.
- سحب بزر الفأرة الأيمنتحريك الكاميرا.
- reset viewزر على اللوحة يعيد الكاميرا إلى الوضع الافتراضي بعد التدوير/الإزاحة/التكبير.
- اخفض الدقة أثناء التجريب، ثم ارفعها للعرض النهائي.
- المنحنيات البارامترية مثالية للحلزونات والمدارات والمسارات.
- إذا بدا السطح خشناً، فازد الدقة أو ضيّق نطاقي x/y.
- يجب تمكين WebGL في متصفحك ليظهر العرض ثلاثي الأبعاد.
حاسبة رسوم بيانية ثلاثية الأبعاد مجانية على الإنترنت. اعرض الأسطح z = f(x,y)، وارسم المنحنيات البارامترية x(t)/y(t)/z(t)، وسُحُب النقاط المبعثرة، كلها بشكل تفاعلي في WebGL مع عناصر تحكم مدارية. اختر الدقة ونطاقات المعاملات، وأدر وكبّر في المتصفح. three.js مدمجة، لذا لا يوجد مكوّن إضافي ولا رفع بيانات.
رسم الأسطح
أدخل z كدالة بدلالة x وy، مثل sin(sqrt(x^2+y^2)) أو x^2-y^2، واختر مجال x/y ودقة الشبكة. يُعرض السطح في WebGL مع إضاءة؛ ارفع الدقة لشبكة أنعم على حساب الأداء.
المنحنيات البارامترية والمبعثرة
بالنسبة للمنحنيات البارامترية، أدخل x(t) وy(t) وz(t) ونطاقاً لـ t لرسم العقد والحلزونات والمسارات. وبالنسبة للمخططات المبعثرة، أدخل قوائم إحداثيات x وy وz لعرض سُحُب النقاط. بدّل أنواع الكائنات من اللوحة؛ كل كائن مستقل.
التنقل والأداء
اسحب للتدوير، ومرّر للتكبير، واسحب بالزر الأيمن (أو بإصبعين) للتحريك باستخدام عناصر التحكم المدارية؛ ويعيد زر الإعادة العرض الافتراضي. لا يُحمَّل محرك three.js إلا عند فتح هذه الأداة، ليبقى تحميل الصفحة الأولى سريعاً. يجب أن يتوفر WebGL في متصفحك.
الأسئلة الشائعة
Qماذا يمكنني أن أرسم في 3D؟
أسطح z=f(x,y) ومنحنيات بارامترية x(t)/y(t)/z(t) وسُحُب نقط مبعثرة من قوائم إحداثيات x/y/z.
Qهل أحتاج إلى تثبيت أي شيء؟
لا. three.js مرفقة مع الموقع ويستخدم الرسم ثلاثي الأبعاد WebGL المدمج في المتصفحات الحديثة — لا حاجة لمكوّن إضافي أو تطبيق.
Qهل يمكنني تدوير العرض وتكبيره؟
نعم — اسحب للتدوير، ومرّر للتكبير، واسحب بالزر الأيمن أو بإصبعين للتحريك، واستخدم الإعادة للعودة إلى الكاميرا الافتراضية.
Qلماذا يبدو السطح متقطعاً عند الدقة العالية؟
الدقة الأعلى للشبكة تعطي أسطحاً أنعم ولكن عدد مثلثات أكبر للعرض. اخفض الدقة إذا كان جهازك بطيئاً؛ أداء WebGL يعتمد على وحدة معالجة الرسوميات لديك.