three.js

问题 I'm working to port a native OpenGL application to WebGL by using the three.js framework. I'm stumbling on the implementation of spherical impostors. Spherical Impostors are basically quads (or two triangles) that are rendered in a way that they always face the camera (much alike billboards). By employing custom vertex and fragment shaders, for every point on the rendered quad, a new position and normal are generated in a way that emulates a sphere. For a more detailed description you can

问题 One of the examples in three simplify modifier found here https://github.com/mrdoob/three.js/blob/dev/examples/js/modifiers/SimplifyModifier.js I understand it takes in a geometry, and simplifies it. is there a way to do this with a gltf model? 回答1: Yes — refer to the simplifier example for full code, but the gist is that you can use SimplifyModifier as usual, except that you need to traverse the model in case it contains multiple meshes: var loader = new THREE.GLTFLoader(); loader.load( 'foo

问题 I loaded an object with OBJLoader. I want to use a Shader Material with a texture. I pass my texture to the uniforms parameters of the material. I pass the UV variable from the vertex shader to the fragment shader. But when I use the uv coordinate for mapping my texture I get always 0,0 or at least this is what it looks like. The whole object is coloured with the bottom left pixel of the texture. Here are my shaders: <script type='x-shader/x-vertex' id='vertex-shader'> uniform float u_time;

问题 I loaded an object with OBJLoader. I want to use a Shader Material with a texture. I pass my texture to the uniforms parameters of the material. I pass the UV variable from the vertex shader to the fragment shader. But when I use the uv coordinate for mapping my texture I get always 0,0 or at least this is what it looks like. The whole object is coloured with the bottom left pixel of the texture. Here are my shaders: <script type='x-shader/x-vertex' id='vertex-shader'> uniform float u_time;

问题 I'm new to THREE.js and with a very poor knowledge in physics - but I am trying to build a football game engine (viewed from top) and right now I'm struggling with the movement of the ball. when trying to move the ball from side to side, the rotation is always facing one direction and I dont understand how to make this rotate in the direction its moving at. Ive added a simple code showing this issue. your help is much appreciated. /* * * SET UP MOTION PARAMS * */ var degrees = 10; var power =

问题 In THREE.js we construct a camera using the following function const camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000); We know from optics that the field of view of a camera is related to the focal length by the following equation FOV = arctan(d/2f) where FOV is the vertical FOV in degrees, d is the height of the image plane in mm, and f is the focal length of the camera in mm. After reading the documentation on the matter, it seems as though d is set by default to be 35mm

问题 I am creating several THREE.Lines using THREE.BufferGeometry. Initially my app had them all starting at the origin and things worked as expected. Now, I would like to be able to start (and end) them at any point. This fiddle (http://jsfiddle.net/9nVqU/) illustrates (I hope) how changing one end of the line away from the origin causes unexpected results. I wondered if it was because any given line follows on from the previous one - switching the start/end order didn't change anything though so

问题 I need to select Collada objects in Three.JS by mouse click. I know that I can select object based on their id and I saw some samples that user can interact with Geometry defined objects (here). But I need to have access to the objects in Collada format. 回答1: Assuming that dae_scene is a COLLADA scene returned from the ColladaLoader, here's what you can do to check for intersection: var toIntersect = []; THREE.SceneUtils.traverseHierarchy(dae_scene, function (child) { if (child instanceof

问题 I am trying to draw a curved road in three.js from some beziers I get with previous calculations, the problem is that I can't find the way to convert the sequence of curved lines (one starting at the end of the previous one) to a curved plane. I have a 3D scene where there are some cars, a road created with a plane and the path of the coming road is painted. I use that Bezier curves I said to represent the path as a Line with function createAdasisBezier(initx, inity, cp1x, cp1y, cp2x, cp2y,

问题 I've been using an old revision of Three.js for quite some time, so I decided to upgrade to the latest (r68). I knew I would bump into some issues, but I wasn't expecting the removal of geometry.computeCentroids() and .centroid property. I'm loading models using the OBJMTLLoader library. The problem with this is that since it no longer has the .computeCentroids() method, I have no way of getting them. I've tried to calculate them using other methods, but to no avail: Three.js How to get