three.js

问题 I'm displaying an OBJ element with Three.js using WebGlRenderer, now I'd like to allow users to rotate the camera around the object in any direction, I've found this answer: Rotate camera in Three.js with mouse But both examples return me errors, the first says that projector is not defined, and I don't know what it means with "projector". I've just a simple camera, the object and some light. The second code says that undefined is not a function. Does someone know how to get the result I need

问题 I have 3D model which I have created in three.js. Based on some data, I want to create a set of arrows which is decorated by a small text label. These labels should be in 2D. It seems like I have two alternatives: either use a separate canvas element to create a texture which in its turn is used in the 3D model, or use HTML on top the 3D model's canvas element. I'm wondering how to go about this. Which is the "correct" way to do this? Any suggestions and example code is very welcome! 回答1: If

问题 I have 3D model which I have created in three.js. Based on some data, I want to create a set of arrows which is decorated by a small text label. These labels should be in 2D. It seems like I have two alternatives: either use a separate canvas element to create a texture which in its turn is used in the 3D model, or use HTML on top the 3D model's canvas element. I'm wondering how to go about this. Which is the "correct" way to do this? Any suggestions and example code is very welcome! 回答1: If

问题 I have 3D model which I have created in three.js. Based on some data, I want to create a set of arrows which is decorated by a small text label. These labels should be in 2D. It seems like I have two alternatives: either use a separate canvas element to create a texture which in its turn is used in the 3D model, or use HTML on top the 3D model's canvas element. I'm wondering how to go about this. Which is the "correct" way to do this? Any suggestions and example code is very welcome! 回答1: If

问题 I'm having a problem trying to write a unit test to check collision detection. I simplify code as only this possible - I have a plane in (0, 0, 0) and I do raycasting from above this plane (from (0, 100, 0)) to bottom (0, -1, 0) and I suppose to find intersections with that plane but no luck. console.clear(); var intersections, from = new THREE.Vector3(0, 100, 0); direction = new THREE.Vector3(0, -1, 0), raycaster = new THREE.Raycaster(); var geometry = new THREE.PlaneGeometry(10, 10, 1, 1);

问题 I have a house model in my game, and I have some materials for the house geometry. There is a material for the wall of the house, and I have a texture-map-image to show the bricks. var mat = new THREE.MeshPhongMaterial( { ambient: 0x969696, map: THREE.ImageUtils.loadTexture( 'textures/G/G0.jpg' ), overdraw: true,combine: THREE.MultiplyOperation } ); In this way above, the texture map appears like GL_CLAMP I want it to show like GL_REPEAT . What should I do? If you can not see the images check

问题 I'd like to move a piece of my code in which i build a THREE.Geometry object to a HTML5 Web Worker. Since i don't want to serialize it to a string (for obvious performance purposes), i'd like to convert it to a Transferable Object like ArrayBuffer, File or Blob so i can pass it "by reference". Do you know a efficient way to convert a THREE.Geometry to one of those objects ? 回答1: The most efficient way is to use the existing geometry buffers such as: geometryGroup.__vertexArray geometryGroup._

问题 I am trying to section my 3D models using three.js in a way similar to how Unity can: I have been playing around with the camera controls and of course I can adjust the near / far fields to clip in the direction of the camera, but what if I wanted to just clip in the X or Y plane? I looked at potentially adding a large transparent block that could slide on that axis and then use binary operations to merge / subtract where it intersects the object, but the tools end up creating a new mesh

问题 I have searched far and wide, but can't seem to figure this pretty basic thing out. I have seen other examples on stackoverflow and elsewhere from a year or two ago, but they fail to work with the latest version of Three.js. Here is a version of what i'm working on: http://medschoolgunners.com/sandbox/3d/. I'm trying to get the grey cone to exactly align with the unlabeled red vector. Ie. I want the tip of the cone to be exactly aligned with the vector and point out from the origin in that

问题 I'm generating objects from an array which I've defined like this (It's not limited to these three): var links = [['Linkedin','img/linkedin.png','-300','-230', '600'], ['Google+', 'img/google.png', '0', '-230', '600'], ['Twitter', 'img/twitter.png', '300', '-230', '600']]; Now it goes through the each loop to create and add the objects to the scene by Three.JS like this: $.each(links, function(i, item) { var thisItemTexture = THREE.ImageUtils.loadTexture(item[1]); thisItemGeo = new THREE