trois js objet cliquable
J'ai deux objets 3d "mailles" que j'ai créé dans three.js.
Je veux ajouter cliquez sur l'événement pour ces objets, de sorte que quand je clique sur l'un d'eux, il est mis à l'échelle et quand je clique sur l'autre, il tourne.
J'ai essayé cette méthode pour ajouter un événement click d'un objet et il ne fonctionne pas.
<script src='threex.domevent.js'> </script>
<script>
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(20, window.innerWidth/window.innerHeight, 1, 1000);
camera.position.z = 100;
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
var geometry = new THREE.CubeGeometry(1,1,1);
var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
var cube = new THREE.Mesh(geometry, material);
scene.add(cube);
cube.addEventListener( 'click',function(){cubeScale()} , false );
function cubeScale()
{
cube.scale.x *= 20;
}
var render = function () {
requestAnimationFrame(render);
cube.rotation.y += 0.1;
renderer.render(scene, camera);
};
render();
</script>
voir mrdoob.github.io/trois.js/exemples/...
voir aussi threejs.org/examples/canvas_interactive_cubes_tween.html
voir aussi threejs.org/examples/canvas_interactive_cubes_tween.html
OriginalL'auteur Mashael | 2013-07-14
Vous devez vous connecter pour publier un commentaire.
Absolument vous avez besoin pour mettre en œuvre raycaster sélectionnez/cliquez sur/choisir certain objet dans three.js. J'ai déjà mis en œuvre dans un de mes projet à l'aide de three.js et raycaster contre collada modèle. Pour votre référence, ces liens peuvent vous aider à:
OriginalL'auteur Ratih Nurmalasari
Vous pouvez utiliser
pickingRay
à effectuer en cliquant avec caméra orthographique comme qui suit dans le présent code:Mais si vous voulez exécuter en cliquant sur le point de vue de la caméra, vous devez effectuer un clic à l'aide de la
unprojectVector
comme qui suit ci-dessous:OriginalL'auteur Filipe