Three.js: Поддержка конструктивной твердотельной геометрии (CSG)

Созданный на 29 мар. 2019  ·  56Комментарии  ·  Источник: mrdoob/three.js

CSG - очень важная функция ... другие 3D-фреймворки имеют встроенную поддержку 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 ) thou: examples

Я не думаю, что вложение его в папку src/ - правильное направление, но обновление его для поддержки BufferGeometry звучит многообещающе. Хорошо ли протестирована библиотека, понятия не имею. :)

Добавление его в основную базу кода может быть немного сложным, текущая версия ( v1 branch ) написана на TypeScript. Прекрасно работает с r100 (и даже с r103 ) thou: examples

Так что это активно развивается. Я не видел этого ярлыка. И ... похоже, что тег v1 поддерживает BufferGeometry! @ThreeDfish

Я голосую за то, чтобы не включать функции CSG в это репо. При необходимости поддерживается Better ThreeCSG .

Так что это активно развивается. Я не видел этого ярлыка. И ... похоже, что тег v1 поддерживает BufferGeometry! @ThreeDfish

Я так не думаю, это единственное упоминание BufferGeometry в версии v1:

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

Кто-нибудь пытался связаться с владельцем ThreeCSG, чтобы узнать, каковы их планы или готовы ли они принять PR для поддержки BufferGeometry? Меня это тоже немного интересует.

Там вроде про BufferGeometry никто не спрашивал ...

Почему бы не перенести разговор на https://github.com/chandlerprall/ThreeCSG? Готов поспорить,

FWIW есть более новая ветка v1 в ThreeCSG, которая полностью переписывает и очищает. Необходимо оптимизировать алгоритм выбора плоскости, а затем он готов к публикации в npm. Я был бы счастлив, если бы кто-нибудь захотел добавить дополнительные функции (см. Также https://github.com/chandlerprall/ThreeCSG/issues/51)

Довожу до вашего сведения:

Помимо https://github.com/chandlerprall/ThreeCSG , в недавней ветке форума Discourse были упомянуты следующие библиотеки CSG:

У меня нет мнения о том, должно ли что-либо из этих трех служить основой для поддержки 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 / examples", "threejs / editor", "threejs / docs",
поскольку "mrdoob / three.js" стал очень большим и тяжелым для загрузки ...
но это уже другая история ...

Если вы хотите им воспользоваться, организация в вашем распоряжении!

Я добавил демо и скриншот в библиотеку:

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

Дайте мне знать, если кому-то понадобится помощь!

@yomboprime @ThreeDfish
Я добавил снимок экрана и демонстрацию в портированную мной библиотеку CSG. Дайте мне знать, если вы сочтете это полезным.
https://github.com/manthrax/THREE-CSGMesh

@yomboprime @ThreeDfish
Я добавил снимок экрана и демонстрацию в портированную мной библиотеку 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, что угодно ... усложняются довольно быстро и требуют собственного набора параметров и т. Д.

Я чувствую, что есть компромисс между кодом «сложность / гибкость / полезность» и «ультра оптимизированный для gpu», который в настройках без javascript вы бы оптимизировали для последнего, но в сценарии js / web вы стремитесь к первое, и только если вы решите, что вам нужно продолжить второе, вы должны использовать что-то вроде wabasm для обработки данных.

Не говоря уже о том, что эти операции CSG уже довольно медленные ... Демо в моем git почти не интерактивно, всего 10 операций на кадр в блоке и 8 сферах подразбиения ...

Тем не менее ... я только что посмотрел демонстрацию csg babylon ... и я почти уверен, что это порт той же самой библиотеки,
И в этой демонстрации это тоже не делается в реальном времени.
https://www.babylonjs.com/demos/csg/

Вот версия, которую я преобразовал, делая более простой пример в реальном времени:

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

Я согласен с тем, что операции CSG не особенно удобны для работы в реальном времени, и что библиотеке не нужно притворяться, что это так. Однако обратите внимание, что геометрия в конечном итоге будет удалена из библиотеки three.js и перемещена в examples/js/* и examples/jsm/* . В этот момент пользователям почти наверняка будет легче использовать BufferGeometry в качестве результата. Если код CSG имеет внутреннюю зависимость от геометрии, это, конечно, кажется прекрасным.

Я бы сказал так ...

Если вы хотите объединить операции в цепочку, ввод Geometry и вывод Geometry имеет смысл, поскольку CSG работает только с этой структурой данных.

Но имейте в виду, что Geometry скоро больше не будет обрабатываться, поэтому на последнем этапе выходные данные нужно будет преобразовать в BufferGeometry .

@manthrax Реализация QuickHull использует собственный набор классов, что упрощает выполнение топологических операций. Например, реализация с половинным краем намного лучше, чем работа с Geometry в этом контексте. Поскольку Geometry ориентирован на рендеринг, другие типы классов могут работать лучше даже для CSG.

Цените отзывы @WestLangley @ Mugen87 .
Я постараюсь сделать так, чтобы он работал с BufferGeometry в рамках подготовки к прекращению поддержки Geometry.
Я также хочу добавить поддержку цвета и материала / группы.

@enricomarino На самом деле, я планировал отправить вам сообщение, чтобы узнать, что вы собираетесь делать с организацией, поскольку я подумывал убрать его из своего имени пользователя и немного разделить вещи. Еще не уверен, как это должно выглядеть, но не хотели бы вы сейчас добавить меня в организацию?

@mrdoob конечно!

Привет всем .. Я сделал более блестящую демонстрацию библиотеки 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 работает отлично!

@manthrax

Я собираюсь добавить оптимизирующую версию BufferGeometry

Использует ли он сейчас THREE.Geometry ?

поэтому я не мог позволить ему отдохнуть и заглянул в https://github.com/jscad/csg.js, который является основной библиотекой CSG https://openjscad.org/
Я просмотрел его и написал свой собственный адаптер THREE BufferGeometry, и на самом деле он НАМНОГО быстрее библиотеки, на которой @manthrax основал свой код. (и поддерживает раскраску вершин)

для той же кости, которая использует сферы с 32 гранями, чтобы вырезать глаза,
THREE-CSGMesh занял 112 секунд,
jscad / csg занял 2,5 секунды !!!

это в 45 раз быстрее ...

я подумываю создать на его основе библиотеку, дайте мне знать, что вы об этом думаете ...

@SebiTimeWaster

Доступен ли он в репо где-нибудь? Похоже, csg.js тоже имеет лицензию MIT.

@mrdoob

Я собираюсь добавить оптимизирующую версию BufferGeometry

Использует ли он сейчас THREE.Geometry?

Кратко взглянув на кодовую базу, похоже, что да, она все еще использует THREE.Geometry, но только на входе и выходе, чтобы преобразовать его во внутреннюю структуру для операций CSG и обратно.

пока нет, если есть интерес, создам ...

пока нет, если есть интерес, создам ...

Хех, думаю, эта ветка - свидетельство интереса! Но, по крайней мере, мне интересно проверить, есть ли у вас более быстрая версия. У меня больше нет необходимости в этом сейчас, но я могу это сделать в будущем. Было бы неплохо перейти к библиотеке для CSG за три, даже если это всего лишь быстрый пример того, как начать работу с csg.js в three.js.

пока нет, если есть интерес, создам ...

Да, официальный пример / решение для csg было бы здорово!

Я на нем ...

Я в основном закончил с портом BufferGeometry файла csg.js @evanw .
Требуется небольшая уборка, на которую я найду время на этой неделе, а затем поделюсь этим здесь.

@mrdoob вы хотите, чтобы в этом репо была библиотека CSG? Если да, то сделаю пиар. В противном случае сделаю для него новое репо.

@SebiTimeWaster Я не видел вашего комментария раньше, упс. Думаю, чем больше, тем веселее 😁

@looeee это полный порт или просто обертка? Похоже, что csg.js в любом случае должен был преобразовать данные во множество внутренних структур для операций CSG, верно? Казалось, что вы просто должны иметь возможность конвертировать в BufferGeometry и обратно по пути туда и обратно.

@looeee вы имеете в виду новый репозиторий внутри здесь ?
было бы интересно, но я рискну предположить, что mrdoob еще не готов.

Я не уверен, что этот репозиторий - подходящее место для поддержки полной библиотеки 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 вместо пользовательского класса векторов,
  • незначительные улучшения API

Эта ветка завершена, и я поделюсь ею, как только немного приведу в порядок. Однако это медленно.

У меня есть еще одна ветка, где я работаю над улучшением скорости. Здесь можно многое сделать, в основном, для расчета ранних выходов, чтобы избежать как можно большей обработки.

@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 и имеет лицензию MIT, если кто-то заинтересован в том, чтобы глубоко погрузиться в это:

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 рейтинги