three.js

问题 I have a 3X3 matrix, like this: [ a11 a12 a13 ] [ a21 a22 a23 ] [ a31 a32 a33 ] but how can I make rotation use this matrix to a mesh in THREE.js. 回答1: You want to specify a mesh's orientation via a matrix. To do so, you can use one of the following two patterns: var matrix = new THREE.Matrix4(); // create once and reuse it matrix.set( a11, a12, a13, 0, a21, a22, a23, 0, a31, a32, a33, 0, 0, 0, 0, 1 ); If you know the matrix is a rotation matrix (i.e., no scaling involved), mesh = new THREE

问题 I'm trying to draw a 3D ellipse with THREE.js. I noticed in the dev version (r50-dev), EllipseCurve (extras/core/Curve.js) and path.ellipse (extras/core/Path.js) have been added. Unfortunately, I am new to THREE.js and although I can do basic things, I haven't been able to find a tutorial on Curve, much less a tutorial on the still-in-developement EllipseCurve. I also understand I can do this with multiple bezier curves. Any pointers would be much appreciated! 回答1: Try using this example as

问题 I'm making a 2d game, where blocks are falling down ( tetris style). I need to render alphabets on these blocks. This is how I am creating blocks: var geometry = new THREE.BoxGeometry( this.BLOCK_WIDTH, this.BLOCK_WIDTH, 4 ); var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } ); this.blocks = []; for (var i = 0; i < rows * columns; i++) { cube = new THREE.Mesh( geometry, material ); cube.visible = false; cube.letter = letterGenerator.getNextLetter(); this.blocks[i] = cube; scene

问题 I'm trying to inject hole to the shape that is already added to the scene, but some thing going wrong... so in details: the shape var well, vertices = [], wellShape, wellMaterial = new THREE.MeshLambertMaterial({color: this.params.wellsColor}); vertices.push(new THREE.Vector2(0,3000)); vertices.push(new THREE.Vector2(4000,3000)); vertices.push(new THREE.Vector2(4000,0)); vertices.push(new THREE.Vector2(0,0)); wellShape = new THREE.Shape(vertices); well = new THREE.Mesh( new THREE

问题 I am trying to change the geometry of some objects in a three.js scene. I have an almost-working piece of code where a mouse click triggers the change, but got the following problem: the (rendered) shape is only changed on the first mouse click, even though the geometry is also successfully modified by each following clicks. Using v66 or v68 of three.js library, if it is relevant. I read Three.js: Completely change object's Geometry and Updating a geometry inside a mesh does nothing but

问题 I'm trying to access the child object sole in a scene. I am able to access the var sole inside the loader function using obj , but I need to access it from outside the loader function. Here's the working code and here's the json model file. I can access it from inside the loader, like this: var loader = new THREE.ObjectLoader(); loader.load("models/shoe4.json", function (obj) { scene.add (obj); scene.rotation.y = Math.PI/1; scene.position.y = -5; scene.position.z = -24; var sole = obj

问题 I need to use three.js on my node.js server to control positions and collisions on players (I try to make a video game). To use three on nodejs, I have install with "npm install three", and it's works. But when I want call JSONLoader, I can't. I my class, I add : var THREE =require('three'); //or require('three/three.js'); var JSON=require('three/src/loaders/JSONLoader.js'); or require('three'); //or require('three/three.js'); var JSON=require('three/src/loaders/JSONLoader.js'); It the same,

问题 I have to display a rotating tetrahedron in an animated HTML5 graphic, using three.js. When i create the object, it's upside down, but it should be on the ground with one surface, like on this screenshot: http://www10.pic-upload.de/08.10.12/v3nnz25zo65q.png This is the code for rotating the object, at the moment. Stored in render() function. But the axis is incorrect and the object is rotating wrong. object.useQuaternion = true; var rotateQuaternion_ = new THREE.Quaternion(); rotateQuaternion

问题 I spent several hours to understand this problem. For some inexplicable reason (for me) raycaster.intersectObject( pointCloud ); do not intersect my 'pointCloud' Object when it has just one vertex (the respective position array attribute with three elements). If the Object has two or more vertices only then raycaster.intersectObject works. My geometry is a THREE.BufferGeometry() and I'm using a custom ShaderMaterial . My object is a THREE.Points . this.pointCloud = new THREE.Points( geometry,

问题 I have converted a mesh from .obj to json using the official converter (https://github.com/mrdoob/three.js/tree/master/utils/converters/obj). The mesh is displayed correctly from one side, but not from the other. I believe the issue is that it only has one side, basically a plane, and therefore all faces and their normals pointing in one direction. How could I fix this? Edit: I could add the mesh twice, and one time using material.side = THREE.BackSide; , but loading it twice doesn't seem