three.js

问题 I am trying to simulate image deformation effects using textures over 2D geomtries using the ThreeJS library. I want to apply a texture image over a hollow circle (basically, a ring built by the THREE.RingGeometry function) and obtain the results shown at this image: Following I show the results I am obtaining in my scene both for the solid ring and its wireframed version: The problem is that, as you see, the texture is been applied in a radial way, from the center of the ring to the outside.

问题 Hi can anyone help me whith this? I have this shader, it works with THREE.Mesh but doesn't with THREE.Particlesystem? I want each particle to have a portion of a given map(texture) and change their positions accordingly, something like this http://www.chromeexperiments.com/detail/webcam-displacement/?f=webgl <script id="vs" type="x-shader/x-vertex"> uniform sampler2D map; varying vec2 vUv; void main() { vUv = uv; vec4 color = texture2D( map, vUv ); float value = ( color.r + color.g + color.b

问题 I've loaded a .dae model, which I would like to use more times in my scene. This code works with meshes, but the collada.scene object isn't a mesh: var mesh2 = new THREE.Mesh( loadedMesh.geometry, loadedMesh.material ); How is it possible, to share the same collada model between some objects? 回答1: The dae scene is not a mesh, but there's certainly a mesh in it. You should console.log the collada object, or put a breakpoint in the load function, and inspect where is the mesh you want. Given a

问题 So I'm editing the vertices of many box geometries to create unique shapes, or to modify the heights of the geometries. It works fine and my scenes look correct (here's an example http://imgur.com/sSx1bPk). However, when I use the ObjectExporter and try to load the scene into http://threejs.org/editor/, none of my vertex changes are present. Also when I try to load the scene.json file into blender, I get an error (which I can't seem to copy/paste) which lists KeyError:'vertices' Basically, I

问题 I'm using a web-worker to load a .json file of an animated 3D model. For each of the big arrays (vertices, normals, etc.), I'm transferring an Float32Array buffer back to the UI thread. Since such buffers are transferable objects, this will take (almost) zero time . Now, it turns out that WebGL (and therefore, Three.js) use Float32Array buffers internally, too. This means I could probably load this 3D animation without copying anything, spending almost zero time in the main thread. Isn't that

问题 I am trying to get collision detection from meshes i lay out on my Three.js scene. I am confused on how the Raycaster reallu works and if i get it right. Here is a fiddle to descripe what i have problem with //Add cuba at 40/40 geometry = new THREE.CubeGeometry(20, 20, 20); material = new THREE.MeshNormalMaterial(); mesh = new THREE.Mesh(geometry, material); mesh.position.setY(40) scene.add(mesh); //Add Ray var origin = new THREE.Vector3(50, 0, 0), direction = new THREE.Vector3(-1,0,0), ray =

问题 I have numerous potentially long polylines (or short, vertices count is highly volatile) to display, so I was thinking about packing them in a bunch of fixed size (let's say 10000 vertices) position BufferAttribute and sending one drawcall per polyline. And if a polyline crosses the 10000 limit boundary, I can just split it, repeat the last vertex from the previous buffer as the first vertex of the new buffer and carry on with multiple THREE.Line objects. My understanding is that a drawcall

问题 Is it possible to load a JSON model once and add it to the scene multiple times with different scales, positions, etc? If I add the Object3D() to an array, give a position and scale to the object in the array, add it to the scene, and then repeat this process, the position and scale are overwritten for every object in the array. I can't think of anything that works, so I'm hoping someone could give me a working example of what I'm trying to accomplish. Here's (one of many) of my failed

问题 I'm working with Three.js, version 68 . I'm using the same method for collision detection as this guy is using here, which is great most of the time (A big "thank you" goes out to the author!): http://stemkoski.github.io/Three.js/Collision-Detection.html Here is a link to the source if you want to download it from github. Just look for Collision-Detection.html : https://github.com/stemkoski/stemkoski.github.com Here is the code that is important to the collision detection: var MovingCube; var

问题 I'm making some 3D text using WebGL , three.js , and THREE.TextGeometry . It's working fine so far. I'm able to create a single line of 3D text. Now I want to create multiline text, like a short paragraph. Preferably, I'd like it to wrap naturally when it reaches the border of a box/rectangle its placed it in. I want a similar behavior that standard HTML text has when it's inside of a div, wrapping to multiple lines when it reaches the edge of it's parent div. Here's how I'm creating a single