2012-06-13 2 views
3

Я использую OBJLoader для загрузки большой 3D-модели (описанной в файле .obj), но он загружает весь файл как один объект Object3D. Используя scene.add (object), он добавляет весь объект к сцене.Выбор выбранной сетки из OBJ-файла

Мне нужно выбрать выбранную сетку и изменить некоторые ее свойства, но когда я добавлю функцию мыши и использую Ray.intersectObjects, попробуйте получить выбранную сетку, она никогда не работает. Я не могу найти, где я ошибся.

Хотел бы помочь, пытаясь заставить эту работу работать. Благодаря!

Это путало меня для пар дней. Следующим является весь мой код:

<!doctype html> 
<html lang="en"> 
    <head> 
     <title>three.js webgl - loaders - OBJ loader</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> 
     <style> 
      body { 
       font-family: Monospace; 
       background-color: #000; 
       color: #fff; 
       margin: 0px; 
       overflow: hidden; 
      } 
      #info { 
       color: #fff; 
       position: absolute; 
       top: 10px; 
       width: 100%; 
       text-align: center; 
       z-index: 100; 
       display:block; 
      } 
      #info a, .button { color: #f00; font-weight: bold; text-decoration: underline; cursor: pointer } 
     </style> 
    </head> 

    <body> 
     <div id="info"> 
     <a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - OBJLoader test 
     </div> 

     <script src="../build/Three.js"></script> 
     <script src="js/loaders/OBJLoader.js"></script> 

     <script src="js/Detector.js"></script> 
     <script src="js/Stats.js"></script> 

     <script> 

      var container, stats; 

      var camera, scene, renderer; 

      var mouseX = 0, mouseY = 0; 

      var windowHalfX = window.innerWidth/2; 
      var windowHalfY = window.innerHeight/2; 

      var _mouse = { x: 0, y: 0 }, 
       objects = [], 
       _projector = new THREE.Projector(); 


      init(); 
      animate(); 


      function init() { 

       container = document.createElement('div'); 
       document.body.appendChild(container); 

       scene = new THREE.Scene(); 

       camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1, 2000); 
       camera.position.z = 100; 
       scene.add(camera); 

       var ambient = new THREE.AmbientLight(0x101030); 
       scene.add(ambient); 

       var directionalLight = new THREE.DirectionalLight(0xffeedd); 
       directionalLight.position.set(0, 0, 1).normalize(); 
       scene.add(directionalLight); 

       var texture = THREE.ImageUtils.loadTexture('textures/ash_uvgrid01.jpg'); 

       var loader = new THREE.OBJLoader(); 
       loader.load("obj/male02/male02.obj", function (object) { 

        for (var i = 0, l = object.children.length; i < l; i ++) { 

         object.children[ i ].material.map = texture; 

        } 

        object.position.y = - 80; 
        object.position.z = - 160; 
        scene.add(object); 
        objects.push(object); 

       }); 

       // RENDERER 

       renderer = new THREE.WebGLRenderer(); 
       renderer.setSize(window.innerWidth, window.innerHeight); 
       container.appendChild(renderer.domElement); 

       document.addEventListener('mousedown', onDocumentMouseDown, false); 

      } 

      function onDocumentMouseDown(event) { 

       event.preventDefault(); 

       // find intersections 
       _mouse.x = (event.clientX/window.innerWidth) * 2 - 1; 
       _mouse.y = - (event.clientY/window.innerHeight) * 2 + 1; 

       var vector = new THREE.Vector3(_mouse.x, _mouse.y, 1); 

       var ray = _projector.pickingRay(vector, camera); 

       var intersects = ray.intersectObjects(scene.children); 

       if (intersects.length > 0) { 
         alert("selected!"); 
         _SELECTED_DOWN = true; 
       } 
      } 

      function animate() { 

       requestAnimationFrame(animate); 
       render(); 

      } 

      function render() { 

       renderer.render(scene, camera); 

      } 

     </script> 

    </body> 
</html> 

ответ

3

ray.intersectObjects() не является рекурсивным. Вам нужно передать список объектов, которые вы хотите проверить.

+0

Однако, возможно, мне следует изменить его на 'ray.intersectObjects (массив, рекурсивный)' ... – mrdoob

+0

Большое спасибо за ваш ответ, но я до сих пор его не понимаю. Вы имеете в виду, что параметры (scene.children), которые я передаю, не являются списком объектов. Тогда как мне его изменить? – user1452571

+0

Попробуйте использовать эту сборку: https://raw.github.com/mrdoob/three.js/dev/build/Three.js и выполните «ray.intersectObjects (scene.children, true)». – mrdoob

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