Как объединить две геометрии или сетки, используя three.js r71?

Здесь я столкнулся с проблемой, так как мне нужно объединить две геометрии (или сетки) в одну. Использование более ранних версий three.js была хорошая функция:Как объединить две геометрии или сетки, используя three.js r71?

THREE.GeometryUtils.merge(pendulum, ball);

Однако, это не на новой версии больше.

Я попытался объединить pendulum и ball со следующим кодом:

ball представляет собой сетку.

var ballGeo = new THREE.SphereGeometry(24,35,35); 
var ballMat = new THREE.MeshPhongMaterial({color: 0xF7FE2E}); 
var ball = new THREE.Mesh(ballGeo, ballMat); 
ball.position.set(0,0,0); 

var pendulum = new THREE.CylinderGeometry(1, 1, 20, 16); 
ball.updateMatrix(); 
pendulum.merge(ball.geometry, ball.matrix); 
scene.add(pendulum);

В конце концов, я получил следующее сообщение об ошибке:

THREE.Object3D.add: object not an instance of THREE.Object3D. THREE.CylinderGeometry {uuid: "688B0EB1-70F7-4C51-86DB-5B1B90A8A24C", name: "", type: "CylinderGeometry", vertices: Array[1332], colors: Array[0]…}THREE.error @ three_r71.js:35THREE.Object3D.add @ three_r71.js:7770(anonymous function) @ pendulum.js:20

источник

2015-05-14 Darius Miliauskas

Наконец, я нашел возможное решение. Я отправляю сообщения, так как это может быть полезно для кого-то еще, пока я потратил много времени. Сложная вещь о манипулировании понятия сеток и геометрии:

var ballGeo = new THREE.SphereGeometry(10,35,35); 
var material = new THREE.MeshPhongMaterial({color: 0xF7FE2E}); 
var ball = new THREE.Mesh(ballGeo, material); 

var pendulumGeo = new THREE.CylinderGeometry(1, 1, 50, 16); 
ball.updateMatrix(); 
pendulumGeo.merge(ball.geometry, ball.matrix); 

var pendulum = new THREE.Mesh(pendulumGeo, material); 
scene.add(pendulum);

источник

2015-05-14 19:54:23

_ «Само собой не было ни одного из деяний Тайлер Кромптон в жизни» _ - _Lady Galadriel_ Спасибо за это – LaughingMan

Чтобы объяснить ответ Дария более четко (как я боролся с ним, пытаясь обновить версию процедурного города г-Дуба работать с Face3 коробки):

По существу, вы объединяете все свои Меши в единую геометрию. Итак, если вы, например, хотите объединить коробку и сферу:

var box = new THREE.BoxGeometry(1, 1, 1); 
var sphere = new THREE.SphereGeometry(.65, 32, 32);

... в одной геометрии:

var singleGeometry = new THREE.Geometry();

... вы можете создать сетки для каждой геометрии:

var boxMesh = new THREE.Mesh(box); 
var sphereMesh = new THREE.Mesh(sphere);

... затем вызвать метод слияния единой геометрии для каждого, передавая геометрию и матрицу каждого в метод:

boxMesh.updateMatrix(); // as needed 
singleGeometry.merge(boxMesh.geometry, boxMesh.matrix); 

sphereMesh.updateMatrix(); // as needed 
singleGeometry.merge(sphereMesh.geometry, sphereMesh.matrix);

После объединения создать сетку из одной геометрии и добавить к сцене:

var material = new THREE.MeshPhongMaterial({color: 0xFF0000}); 
var mesh = new THREE.Mesh(singleGeometry, material); 
scene.add(mesh);

Рабочий пример:

<!DOCTYPE html> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r77/three.js"></script> 
 
<!-- OrbitControls.js is not versioned and may stop working with r77 --> 
 
<script src='http://threejs.org/examples/js/controls/OrbitControls.js'></script> 
 

 
<body style='margin: 0px; background-color: #bbbbbb; overflow: hidden;'> 
 
    <script> 
 
    // init renderer 
 
    var renderer = new THREE.WebGLRenderer(); 
 
    renderer.setSize(window.innerWidth, window.innerHeight); 
 
    document.body.appendChild(renderer.domElement); 
 

 
    // init scene and camera 
 
    var scene = new THREE.Scene(); 
 
    var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 0.01, 3000); 
 
    camera.position.z = 5; 
 
    var controls = new THREE.OrbitControls(camera) 
 
    \t 
 
    // our code 
 
    var box = new THREE.BoxGeometry(1, 1, 1); 
 
    var sphere = new THREE.SphereGeometry(.65, 32, 32); 
 

 
    var singleGeometry = new THREE.Geometry(); 
 

 
    var boxMesh = new THREE.Mesh(box); 
 
    var sphereMesh = new THREE.Mesh(sphere); 
 

 
    boxMesh.updateMatrix(); // as needed 
 
    singleGeometry.merge(boxMesh.geometry, boxMesh.matrix); 
 

 
    sphereMesh.updateMatrix(); // as needed 
 
    singleGeometry.merge(sphereMesh.geometry, sphereMesh.matrix); 
 

 
    var material = new THREE.MeshPhongMaterial({color: 0xFF0000}); 
 
    var mesh = new THREE.Mesh(singleGeometry, material); 
 
    scene.add(mesh); 
 

 
    // a light 
 
    var light = new THREE.HemisphereLight(0xfffff0, 0x101020, 1.25); 
 
    light.position.set(0.75, 1, 0.25); 
 
    scene.add(light); 
 
\t 
 
    // render 
 
    requestAnimationFrame(function animate(){ 
 
\t  requestAnimationFrame(animate); 
 
\t  renderer.render(scene, camera); \t \t 
 
    }) 
 
    </script> 
 
</body>

По крайней мере, как я я интерпретирую вещи; приношу свои извинения кому-либо, если у меня что-то не так, поскольку я не настолько близкий к тому, чтобы быть экспертом three.js (в настоящее время учащимся). У меня просто была «неудача», чтобы попробовать себя в настройке процедурного кода города г-на Дуба, когда последняя версия ломает вещи (одно из них - это слияние, тот факт, что three.js больше не использует квадратики для куба -ahem - геометрия ящика - другая, которая привела к тому, что всевозможные забавы заставляют затенение и снова работать правильно).

источник

2015-10-28 16:12:57

спасибо за это. обновление некоторого кода, который я просто портировал из 500 000 предупреждений, выглядел довольно устрашающе. Я не очень доволен тем, как это было обработано, найти ответ был слишком сложным для того, что я не контролирую. – fluffybunny

Сообщение об ошибке является правильным. Цилиндровая геометрия - это не объект3D. Сетка есть. Сетка построена из геометрии и материала. Сетка может быть добавлена к сцене, в то время как геометрия не может.

В новейших версиях трех.js, Geometry имеет два метода слияния: merge и mergeMesh.

слияние принимает обязательный аргумент геометрию и два необязательных аргумента матрицы и materialIndexOffset.
геометрия. mergeMesh (сетка) является в основном сокращением для geom. merge (сетка геометрия, сетка матрица), как используется в других ответах. ('geom' и 'mesh' - произвольные имена для геометрии и Mesh соответственно.) Материал Mesh игнорируется.

источник

2016-05-25 19:12:55

Как объединить две геометрии или сетки, используя three.js r71?

ответ

Смежные вопросы