three.js

问题 I have two THREE.ParticleSystem systems with particles that have textures with alpha transparency, one is using AdditiveBlending (fire texture), the other uses NormalBlending (smoke texture) and they use simple custom vertex and fragment shaders. Each ParticleSystem has "sortParticles = true" and independently they work perfectly, however when both types of particles overlap the first particle system (fire texture) has a similar transparency depth error that is normally associated with

问题 I want to simulate 3D text being "drawn out" or "built" inside my scene. The idea is to take the final score from a game and display it dynamically at the end of the game. If you don't know what I mean, imagine somebody graffiti-ing/tagging some numbers on a wall. The numbers don't "pop" in like they would if you typed them, but are constructed by building up each number. Reference for graffiti-ing I'm pretty sure that I want to use TextGeometry for this but I have absolutely no idea how I

问题 I want to simulate 3D text being "drawn out" or "built" inside my scene. The idea is to take the final score from a game and display it dynamically at the end of the game. If you don't know what I mean, imagine somebody graffiti-ing/tagging some numbers on a wall. The numbers don't "pop" in like they would if you typed them, but are constructed by building up each number. Reference for graffiti-ing I'm pretty sure that I want to use TextGeometry for this but I have absolutely no idea how I

问题 The idea is to have a square room in which an object (and the camera a little further back to be able to view the object - i.e. over the shoulder camera) moves around from corner to corner, facing the walls at all times but curving smoothly round, so that when transitioning from one wall to the other, the object (and camera) are not exactly 90 degrees perpendicular, but transition from 90 degrees perpendicular with one wall, to 90 degrees perpendicular with the next. How I went about it My

问题 Here I'm looking to rotate only the object using camera instead of rotating the whole camera around the object. First, the center origin point of the object remains the same where it works properly, but once I pan the object the center of the origin differs and rotates the camera around the object. https://jsfiddle.net/1ax8hf07/ var scene, renderer, camera; var cube; var controls; var containerWidth = window.innerWidth, containerHeight = window.innerHeight; var isDragging = false; var

问题 I have vertices(x,y,z coords) of a polygon as input. How can I render a polygon having these vertices in three.js? There is this documentation.But it seems to involve bezier. I need simple straight edged polygon. 回答1: You can create a polygon from vertices with the following code: var geom = new THREE.Geometry(); var v1 = new THREE.Vector3(0,0,0); var v2 = new THREE.Vector3(0,500,0); var v3 = new THREE.Vector3(0,500,500); geom.vertices.push(v1); geom.vertices.push(v2); geom.vertices.push(v3);

问题 I try used threejs to test out simple 3D plane without mesh object just zero plane base on camera with unproject and it work. But I try on Aframe it didn't work and there is bug. getInverse > m.elements error that it show on the console log. Here simple example of Aframe. https://gist.github.com/Lightnet/8fb3d4a7c5f3ed2b3865bf894aecb9b8 Any way to solve this? 回答1: You shouldn't perform your operations on the camera = document.querySelector('[camera]'); , because it grabs the a-frame's wrapper

问题 I've define that my games is extremely slow with enabled shadows on old mobile devices (Samsung galaxy S4, IPhone 5). When I turn off shadows it's improving performance greatly. Does any one know how to detect slow GPU to turn off shadows completely on slow devices or how to improve shadow performance? I've try to use diferrent shadow.mapSize on lights and shadowMap.type on renderer and it dosen't improve performance. Some details: I use PerspectiveCamera and WebGLRenderer with render size

问题 I've been working off this example http://meetar.github.io/threejs-shader-demos/llama.html that uses an animated gif as a displacement map. However, it uses THREE.js r58 and I'm using THREE.js r85 and the following code from the example doesn't work for me dispTexture = new THREE.Texture(llamacanvas); var shader = THREE.ShaderLib[ "normalmap" ]; uniforms = THREE.UniformsUtils.clone( shader.uniforms ); uniforms[ "enableDisplacement" ] = { type: 'i', value: 1 }; uniforms[ "tDisplacement" ] = {

问题 I have Three.Geometry object consisting of many vertexes and faces (grid). I want to dynamically change the color or material of selected face. geometry.colorsNeedUpdate = true; geometry.faces[1].color.setHex(0xcccccc); //this doesn't work Above code makes new color opacity weird. It behaves like it doesn't replace the color but blends new color with old. Therefore overwriting darker color with ligher is imposible. How to fix this ? My materials do apply : mat = new THREE.MeshBasicMaterial(