Three.js: دعم الهندسة الصلبة البناءة (CSG)

تم إنشاؤها على ٢٩ مارس ٢٠١٩  ·  56تعليقات  ·  مصدر: mrdoob/three.js

CSG هي ميزة مهمة جدًا ... تتمتع أطر العمل ثلاثية الأبعاد الأخرى بدعم CSG المدمج (Babylon.js) ، CSG الوحيد الذي يمكنني العثور عليه هو المكون الإضافي القديم لمدة 7 سنوات (https://github.com/chandlerprall/ThreeCSG)

أقترح أن يتم تحديث هذا المكون الإضافي لـ bufferGeometry وإضافته إلى قاعدة رمز three.js كمكوِّن إضافي رسمي لدعم CSG.

أنا على استعداد للمساهمة بأموال لرؤية هذا يحدث.

Enhancement

التعليق الأكثر فائدة

لقد أجريت تحويلًا آخر لمكتبة madebyevan CSG التي قد تجدها مفيدة .. إنها تعمل مع الثلاثة (103) الحالية وأصلحت بعض المشكلات التي واجهتها مع الوحدة القديمة الموجودة هناك. يسمح بالهندسات العازلة ولكن فقط عن طريق تحويلها إلى أشكال هندسية داخليًا.

https://github.com/manthrax/THREE-CSGMesh

آمل أن يساعد هذا شخصًا ما ولا تتردد في تقديم ملاحظات / اقتراحات.

ال 56 كومينتر

يمكنني أن أجربها في نهاية هذا الأسبوع ... دعني أرى كيف ستسير الأمور.

لقد أضفت OrbitControls وفحصت النتيجة ، لا يبدو أنها صحيحة تمامًا. هل أنت متأكد من أن هذه المكتبة تم اختبارها بشكل كافٍ؟
يرجى إجراء بعض الاختبارات عليه قبل أن أحاول "تخزينه مؤقتًا" 😉
image

قد تكون إضافته إلى قاعدة التعليمات البرمجية الأساسية معقدة بعض الشيء ، الإصدار الحالي ( v1 branch ) موجود في TypeScript. يعمل بشكل جيد مع r100 (وحتى r103 ) أنت: أمثلة

لا أعتقد أن تجميعه في المجلد src/ هو الاتجاه الصحيح ، لكن تحديثه لدعم BufferGeometry يبدو واعدًا. ليس لدي أي فكرة عما إذا كانت المكتبة قد تم اختبارها جيدًا. :)

قد تكون إضافته إلى قاعدة التعليمات البرمجية الأساسية معقدة بعض الشيء ، الإصدار الحالي ( v1 branch ) موجود في TypeScript. يعمل بشكل جيد مع r100 (وحتى r103 ) أنت: أمثلة

لذلك تم تطويره بنشاط. لم أر تلك العلامة. و ... يبدو أن علامة v1 تدعم BufferGeometry! تضمين التغريدة

أنا أصوت لعدم تضمين ميزات CSG في هذا الريبو. يتم دعم أفضل ThreeCSG إذا لزم الأمر.

لذلك تم تطويره بنشاط. لم أر تلك العلامة. و ... يبدو أن علامة v1 تدعم BufferGeometry! تضمين التغريدة

لا أعتقد ذلك ، هذه هي الإشارة الوحيدة لـ BufferGeometry في الإصدار v1:

function convertGeometryToTriangles(geometry) {
        if (isBufferGeometry(geometry)) {
            throw new Error('threecsg: Only Three.Geometry is supported.');
        }

هل حاول أي شخص الاتصال بمالك شركة ThreeCSG لمعرفة خططهم أو ما إذا كانوا منفتحين على تلقي العلاقات العامة لدعم BufferGeometry؟ أنا مهتم قليلاً بهذا أيضًا.

يبدو أنه لم يسأل أحد هناك عن BufferGeometry ...

لماذا لا تحول المحادثة إلى https://github.com/chandlerprall/ThreeCSG؟ أراهن أن chandlerprall سيكون سعيدًا برؤية مثل هذا الاهتمام بمشروعه 😊

FWIW يوجد فرع v1 أحدث في ThreeCSG وهو إعادة كتابة وتنظيف كاملة. تحتاج إلى تحسين خوارزمية محدد المستوى ومن ثم تصبح جاهزة للنشر npm. سأكون سعيدًا إذا أراد أي شخص المساهمة بميزات إضافية (انظر أيضًا https://github.com/chandlerprall/ThreeCSG/issues/51)

لمعلوماتك:

إلى جانب https://github.com/chandlerprall/ThreeCSG ، تم ذكر مكتبات CSG التالية في موضوع منتدى Discourse الأخير:

ليس لدي رأي حول ما إذا كان يجب استخدام أي من هؤلاء الثلاثة كأساس لدعم CSG الخاص بـ Three.js.

لقد أجريت تحويلًا آخر لمكتبة madebyevan CSG التي قد تجدها مفيدة .. إنها تعمل مع الثلاثة (103) الحالية وأصلحت بعض المشكلات التي واجهتها مع الوحدة القديمة الموجودة هناك. يسمح بالهندسات العازلة ولكن فقط عن طريق تحويلها إلى أشكال هندسية داخليًا.

https://github.com/manthrax/THREE-CSGMesh

آمل أن يساعد هذا شخصًا ما ولا تتردد في تقديم ملاحظات / اقتراحات.

manthrax سيكون مشروعك إضافة جيدة إلى سلسلة three.js حتى يتمكن الأشخاص الذين يبحثون عن مكون إضافي من العثور عليه بالفعل👍

https://discourse.threejs.org/t/looking-for-updated-plug-in-for-csg/6785

مدهش! لست متأكدًا من مدى إمكانية ذلك ، لكنني أعتقد أن أيًا من هذه الحلول سيستفيد من بعض الأمثلة التي توضح الأداء وقدرات التحرير في الوقت الفعلي مثل الكثير من محرري المحركات ، الآن.

أفضّل شخصيًا إبقاء CSG خارج المكتبة وتطويرها بشكل مستقل.

أنا أتفق مع هذا ، ولكن قد يكون من المفيد أن يكون لديك مجموعة رسمية من "اتفاقيات إعادة الشراء ذات الصلة". لقد أنشأت منظمة يمكننا استخدامها لهذا إذا قررنا المضي قدمًا. تم التقاط github.com/threejs بواسطة enricomarino ، لكن github.com/three-js كان هناك. سأقوم بنقل الملكية إلى أي شخص ، فقط برزت أنه من الجيد القفز على الاسم!

لذلك ، هذه المنظمة متاحة لأي شخص يريد إنشاء مشاريع متعلقة بـ three.js لا تناسب هنا تمامًا.

https://github.com/three-js

لقد أنشأت المنظمة https://github.com/threejs لاستضافة المشاريع المتعلقة بـ three.js.

في الواقع ، في ذلك الوقت ، فكرت في تقسيم الريبو الأحادي "three.js" إلى عدة مستودعات ،
مثل "threejs / core" ، و "treejs / أمثلة" ، و "threejs / editor" ، و "threejs / docs" ،
منذ أن أصبح "mrdoob / three.js" كبيرًا جدًا وثقيلًا للتنزيل ...
ولكن هذه قصة أخرى...

إذا كنت ترغب في استخدامه ، فإن المنظمة تحت تصرفك!

لقد أضفت عرضًا توضيحيًا ولقطة شاشة إلى المكتبة:

https://github.com/manthrax/THREE-CSGMesh

اسمحوا لي أن أعرف إذا كان أي شخص يحتاج إلى مساعدة في ذلك!

تضمين التغريدة
لقد أضفت لقطة شاشة وعرضًا توضيحيًا إلى مكتبة CSG التي قمت بنقلها. اسمحوا لي أن أعرف إذا وجدت أنها مفيدة.
https://github.com/manthrax/THREE-CSGMesh

تضمين التغريدة
لقد أضفت لقطة شاشة وعرضًا توضيحيًا إلى مكتبة CSG التي قمت بنقلها. اسمحوا لي أن أعرف إذا وجدت أنها مفيدة.
https://github.com/manthrax/THREE-CSGMesh

ThreeDfish إذا كنت لا تزال مهتمًا ، يمكنني إنشاء وظيفة CSG.toBufferGeometry في هذه المكتبة. لا يزال CSG يقبل Geometry كمدخلات ، ولكن يمكن أن يكون الإخراج Geometry (لمزيد من العمليات المنطقية) أو BufferGeometry (الإخراج النهائي للعرض).
ما رأيك @ manthrax ؟

enricomarino هل يمكنك منحي الوصول إلى github.com/threejs؟ أرغب في إعداد الريبو مع نماذج الاختبار لـ LWOLoader . راجع للشغل أنت شخص صعب للعثور على تفاصيل الاتصال بـ

yomboprime لست متأكدًا مما تطلبه ..

يقبل الإصدار الذي قمت بنقله كلاً من شبكة BufferGeometry أو Geometry .. إنه ينتج Geometry ، والتي يمكن تحويلها إلى BufferGeometry باستخدام

mesh.geometry = new THREE.BufferGeometry().fromGeometry(mesh.geometry)

لذلك لا أعرف ما إذا كانت هناك بالفعل حاجة لوظيفة مساعد إضافية لأن التحويل بسيط جدًا.

التحويل Geometry -> BufferGeometry خسارة كبيرة للأسف - سيؤدي ذلك إلى إلغاء فهرسة الهندسة المفهرسة وزيادة عدد الرؤوس ، بالإضافة إلى إضافة ألوان الرأس (البيضاء). من المحتمل أن يكون الإخراج النهائي مثل BufferGeometry مثاليًا.

لا تهتم عملية CSG بالفهرسة. إنه يعمل ويخرج 3 نماذج فريدة لكل مثلث بغض النظر عن السبب.

كما أنه لا يتعامل مع ألوان الرأس.

يعد تحسين الشبكة الناتجة أمرًا يمكن / يجب القيام به باستخدام أدوات / وظائف مساعدة أخرى ، imho.

وإلا فهو مجرد تكرار لوظيفة غبية يجب أن تكون في الواقع في مكتبة منفصلة.

أوافق على أن هناك بالتأكيد مساحة من حيث الأداة المساعدة لتحسين الهندسة في THREE.js. تنطبق المشكلة على أكثر من مجرد BufferGeometry. لكن تطبيق التحسينات على المخازن المؤقتة الكبيرة ، عبر js ، في وقت التشغيل ، هي عمليات مضطربة .. وأي تقنيات تطبقها لتقليل التعقيد ، على سبيل المثال octtree / kdtree أيا كان .. تصبح معقدة بسرعة كبيرة وتتطلب مجموعة خاصة بها من المعلمات وما إلى ذلك ..

أشعر أن هناك مفاضلة بين "التعقيد / المرونة / المنفعة" للشفرة مقابل "فائقة التحسين لوحدة معالجة الرسومات" التي في إعداد غير جافا سكريبت ، يمكنك تحسين الأخير ، ولكن في سيناريو js / الويب ، قد تهدف إلى الأول ، وفقط إذا قررت أنك بحاجة إلى متابعة هذا الأخير ، فستستخدم شيئًا مثل wabasm لتحليل البيانات.

ناهيك عن أن عمليات CSG هذه بطيئة جدًا بالفعل .. العرض التوضيحي في بوابة الدخول الخاص بي بالكاد يتفاعل مع 10 عمليات فقط لكل إطار في صندوق و 8 مجال فرعي ...

ومع ذلك .. لقد ألقيت نظرة على العرض التوضيحي لـ babylon csg .. وأنا متأكد تمامًا من أنه منفذ للمكتبة نفسها بالضبط ،
ولا يتم ذلك في الوقت الفعلي في هذا العرض التوضيحي أيضًا.
https://www.babylonjs.com/demos/csg/

هذا هو الإصدار الذي قمت بتحويله ليقدم مثالاً أبسط في الوقت الفعلي:

http://vectorslave.com/csg/CSGDemo.html

أوافق على أن عمليات CSG ليست صديقة للوقت الفعلي بشكل خاص ، وأن المكتبة لا تحتاج إلى التظاهر بذلك. ومع ذلك ، لاحظ أنه ستتم إزالة Geometry في النهاية من مكتبة three.js ، ونقلها إلى examples/js/* و examples/jsm/* . عند هذه النقطة ، من شبه المؤكد أن المستخدمين سيكون لديهم وقت أسهل في استخدام BufferGeometry كنتيجة لذلك. إذا كان كود CSG له تبعية داخلية على Geometry ، فهذا يبدو جيدًا بالطبع.

أود أن أقولها بهذه الطريقة ...

إذا كنت تريد تسلسل العمليات ، فإن إدخال Geometry وإخراج Geometry أمر منطقي ، لأن CSG تعمل على هيكل البيانات هذا فقط.

لكن اعلم أن Geometry لن يكون قابلاً للعرض قريبًا ، لذا يجب تحويل الناتج إلى BufferGeometry في الخطوة الأخيرة.

manthrax يستخدم تطبيق QuickHull مجموعة خاصة من الفئات حتى يسهل تنفيذ العمليات الطوبولوجية. على سبيل المثال ، يعد تطبيق نصف الحافة أفضل بكثير من العمل مع Geometry في هذا السياق. نظرًا لأن Geometry يركز على العرض ، فقد تعمل أنواع أخرى من الفصول الدراسية بشكل أفضل حتى مع CSG.

نقدر ردود الفعلdonmccurdyWestLangley @ Mugen87.
سأبحث في جعله يعمل بشكل أصلي مع BufferGeometry استعدادًا لإيقاف Geometry.
أريد أيضًا إضافة دعم اللون والمواد / المجموعة أيضًا.

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

تضمين التغريدة

مرحبًا بالجميع .. لقد قمت بعمل عرض توضيحي أكثر لمعانًا لمكتبة CSG ، وقمت بإصلاح الخلل في الجيل العادي ، إذا كان أي شخص مهتمًا:

http://vectorslave.com/csg/CSGShinyDemo.html

و gh:
https://github.com/manthrax/THREE-CSGMesh

إنني أتطلع إلى إضافة نسخة تحسين BufferGeometry ، وشيء يحافظ على فصل المواد بين المدخلات ، بحيث يمكن استخدامه مباشرة لشيء مثل برنامج SCAD.

فقط فكرت في أن أسقط هذه الروابط هنا للإلهام وفي حال أراد أي شخص الغوص بعمق فيها. صادفت أداة CSG هذه في Unity التي تتميز ببعض الأداء الرائع وقدرات إنشاء المحتوى:

https://assetstore.unity.com/packages/tools/modeling/realtime-csg-69542

ويبدو أن المنشئ قد كتب بعض المقالات حول التنفيذ (هناك ستة أجزاء في المجموع):

http://sandervanrossen.blogspot.com/2010/05/realtime-csg-optimizations.html
http://sandervanrossen.blogspot.com/2010/05/realtime-csg-part-5.html

لقد قمت بنقل مكتبة csg وهي تعمل بشكل جيد للغاية في الوقت الحالي.
يمكنني تحديث هذا المشروع إذا لزم الأمر.

https://github.com/FishOrBear/csg.ts

أي تحديث على هذا؟

المكتبة من manthrax تعمل على أكمل وجه!

تضمين التغريدة

أنا أبحث في إضافة نسخة تحسين BufferGeometry

هل تستخدم THREE.Geometry في الوقت الحالي؟

لذلك لم أستطع تركه يستريح ونظرت إلى https://github.com/jscad/csg.js وهي مكتبة CSG الأساسية لـ https://openjscad.org/
لقد قمت بتصفحه وكتبت مهايئ ثلاثي BufferGeometry الخاص بي وهو في الواقع أسرع بكثير من المكتبة التي اعتمد @ manthrax على الكود الخاص به. (وهو يدعم تلوين قمة الرأس)

لنفس النرد الذي يستخدم كرات بـ 32 وجهًا لقطع العينين ،
استغرق برنامج THREE-CSGMesh 112 ثانية ،
استغرق jscad / csg 2.5 ثانية !!!

هذا أسرع بـ 45 مرة ...

أفكر في إنشاء مكتبة منها ، دعني أعرف رأيك فيها ...

تضمين التغريدة

هل هو متاح في الريبو في أي مكان؟ يبدو أن csg.js هو ترخيص MIT أيضًا.

تضمين التغريدة

أنا أبحث في إضافة نسخة تحسين BufferGeometry

هل تستخدم تقنية THREE.Geometry في الوقت الحالي؟

عند النظر إلى قاعدة الشفرة لفترة وجيزة يبدو أنها لا تزال تستخدم THREE.Geometry ولكن فقط على المدخلات والمخرجات لتحويلها إلى ومن هيكل داخلي لعمليات CSG.

ليس بعد ، إذا كان هناك اهتمام فسأبتكر واحدًا ...

ليس بعد ، إذا كان هناك اهتمام فسأبتكر واحدًا ...

هيه أعتقد أن هذا الخيط دليل على الفائدة! لكن على الأقل أنا مهتم بالتحقق من ذلك إذا كان لديك إصدار أسرع. لم يعد لدي حاجة فورية لذلك بعد الآن ولكن قد أفعل ذلك في المستقبل. سيكون من الجيد أن تذهب إلى مكتبة CSG في ثلاثة حتى لو كان مجرد مثال سريع لكيفية البدء مع csg.js في three.js.

ليس بعد ، إذا كان هناك اهتمام فسأبتكر واحدًا ...

نعم ، سيكون وجود مثال / حل رسمي لـ CSG رائعًا!

أنا في ذلك ...

لقد انتهيت غالبًا من منفذ BufferGeometry الخاص بـ evanw 's csg.js.
يحتاج إلى القليل من الترتيب ، والذي سأجده لهذا الأسبوع ، ثم سأشاركه هنا.

mrdoob هل تريد مكتبة CSG في هذا الريبو؟ إذا كان الأمر كذلك ، فسوف أقوم بعلاقات عامة. خلاف ذلك ، سأقوم بعمل ريبو جديد لها.

SebiTimeWaster لم أر تعليقك من قبل الآن ، عفوًا. كلما زاد مرحا أعتقد

@ looeee هل هو منفذ كامل أم مجرد غلاف؟ يبدو أنه كان على csg.js تحويل البيانات إلى الكثير من الهياكل الداخلية لعمليات CSG على أي حال ، أليس كذلك؟ يبدو أنه يجب أن تكون قادرًا على التحويل من BufferGeometry وإليه في طريقك للدخول والخروج.

looeee هل تقصد الريبو الجديد داخل هنا ؟
سيكون ممتعًا لكني أخمن أن مردوب ليس جاهزًا بعد.

لست متأكدًا من أن هذا المستودع هو المكان المناسب للاحتفاظ بمكتبة CSG كاملة ... ربما أضف مثالاً ، باستخدام بنية مصغرة لمكتبة CSG في examples/js(m)/libs/ ؟

إذن ، هذا هو رأيي في كل شيء (يعتمد على https://github.com/jscad/csg.js):
https://github.com/SebiTimeWaster/three-csg
بمثال (اختبار تحمّل):
https://sebitimewaster.github.io/three-csg/examples/example2.html

@ looeee ، ما رأيك في تنفيذ نفس اختبار التحمل ، ثم يمكننا مقارنة وتحسين الكود الخاص بنا مقابل بعضنا البعض ...

@ looeee هل هو منفذ كامل أم مجرد غلاف؟

لدي فرع واحد هو مجرد غلاف لـ csg.js مع بعض التغييرات الطفيفة:

  • نمطي الرمز
  • تمت محاذاة أسماء الوظائف إلى three.js واستخدمت Vector3 بدلاً من فئة متجه مخصصة ،
  • تحسينات طفيفة لواجهة برمجة التطبيقات

هذا الفرع مكتمل ، وسوف أشاركه بمجرد ترتيبه قليلاً. ومع ذلك ، فهي بطيئة.

لدي فرع آخر حيث أعمل على تحسين السرعة. هناك الكثير الذي يمكن القيام به هنا ، لا سيما فيما يتعلق بحساب العوائد المبكرة لتجنب أكبر قدر ممكن من المعالجة.

SebiTimeWaster ، لقد

SebiTimeWaster هل يستطيع تنفيذ csg معالجة إحداثيات النسيج؟

إليك كيف تبدو إحداثيات النسيج في ملكي.

2020-06-08 20_20_34-Discoverthreejs com - three js CSG Demo A

ها هو الريبو:
https://github.com/looeee/threejs-csg

هناك فرعين ، _master_ ، وهو قريب جدًا من غلاف csg.js كما وصفته أعلاه ، و _advanced_. لقد عبرت هناك عن جميع عمليات CSG باستخدام طرق LogicalOR و complement :

الاتحاد : _ (يسار || يمين) _
اطرح : _! (! يسار || يمين) _
تقاطع : _! (! يسار ||! يمين) _

يؤدي القيام بذلك إلى تسهيل التفكير في العمليات قليلاً كما يجعل عملية الطرح والتقاطع أسرع قليلاً. هناك أيضًا بعض التجارب لإجراء عملية دمج وإعدام على أساس مربع إحاطة عالي المستوى قبل إجراء عمليات CSG الكاملة ، مما يوفر بعض التسريع اللائق عند إجراء العديد من العمليات في وقت واحد.

ومع ذلك ، فإن النهج الأفضل ، والذي يبدو أنه الأكثر استخدامًا في التطبيقات الأخرى ، هو إنشاء BVH للهندسات والعمليات واجتياز الشجرة لإنشاء الشكل الهندسي النهائي.

SebiTimeWaster في الوقت الحالي ، قررت النظر في تطبيقات CSG البديلة بدلاً من المضي قدمًا في هذا التطبيق. إذا كان هناك أي شيء مفيد من الريبو الخاص بي ، فلا تتردد في أخذه.

تحرير: هذه التغريدة تلخص مشاعري بالضبط

يبدو أن مصدر المكوّن الإضافي Realtime CSG لـ Unity الذي ربطته أعلاه قد تم نشره على Github وهو مرخص من معهد ماساتشوستس للتكنولوجيا إذا كان أي شخص مهتمًا بأخذ غوص عميق في ذلك:

https://github.com/LogicalError/realtime-CSG-for-unity

لديه أيضًا بعض المنشورات الفنية حول مكون CSG الإضافي الخاص به على مدونته أيضًا ، إذا عدت قليلاً:

https://sandervanrossen.blogspot.com/search؟q=Realtime+CSG

كان هناك أيضًا حديث GDC جديد منه في مارس من هذا العام على CSG:

https://www.youtube.com/watch؟v=Iqmg4gblreo

لم أعبث في عمله في Unity بنفسي ، لكن الأداء في مقاطع الفيديو يبدو رائعًا.

هناك أيضًا هذا الذي يعتمد على Unity CSG ولكنه تطبيق C # مستقل ، قد يكون من الأسهل فهمه. إنه أقدم قليلاً على الرغم من أنه قد لا يكون متطورًا.

https://github.com/LogicalError/Realtime-CSG-demo

يحتوي محرك Godot أيضًا على CSG الذي اختبرته ولديه أداء لائق جدًا. مستندات / كود .

هناك أيضًا Carve CSG و xcsg (الذي يستخدم Carve) و Cork .

أتساءل عما إذا كان الحل الأفضل هنا هو أخذ أحد هذه الحلول الحالية (ربما Carve نظرًا لأنه CPP ويبدو أنه يستخدم في الكثير من الحزم الأخرى) وتحويله إلى Wasm.

أتساءل عما إذا كان الحل الأفضل هنا هو أخذ أحد هذه الحلول الحالية (ربما Carve نظرًا لأنه CPP ويبدو أنه يستخدم في الكثير من الحزم الأخرى) وتحويله إلى Wasm.

أنا أقل دراية بـ emscripten لكن هذا لا يبدو مقاربة سيئة. يبدو أن Carve و Cork حاصلان على ترخيص GPL و LGPL ، ومع ذلك ، فهذا شيء يجب مراعاته.

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

http://www.cs.columbia.edu/cg/mesh-arrangements/

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات