three.js

问题 I'd like to add outline to meshes. I followed the example which created a new mesh using the same geometry, and scaled the mesh. var outlineMaterial = new THREE.MeshBasicMaterial({color: 0x00ffff, side: THREE.BackSide}); this.outlineMesh = new THREE.Mesh(target.geometry, outlineMaterial); this.outlineMesh.quaternion = target.quaternion; this.outlineMesh.position = target.position; this.outlineMesh.scale.copy(target.scale); this.outlineMesh.scale.multiplyScalar(1.05); this.scene.add(this

问题 I want the same object to be rendered twice, once on-screen and once off-screen. The on-screen mesh has a geometry and a MeshLambertMaterial. This material has vertexColors: THREE.VertexColors . The off-screen mesh has the same geometry and a MeshBasicMeterial with vertexColors: THREE.FaceColors . During initial setup each faceColor is set to a unique color. Each vertexColor is set to a single color (Later these vertexcolors can change by "painting" on the object). Then I want to render both

问题 I am trying to make an app which adds models from google poly in GLTF format. I had the issue of some models being extremely large when added on the scene which I solved by computing their size with bounding box max and min values and setting the scale amount. Now after adding the objects to the scene when I open the inspector and drag to scale objects, even with a small amount of drag the objects becomes very large. If there is any way to reset the scale value of loaded objects so that

问题 Is it possible to specify other colors than black for shadow rendering? I would like to allow users to experiment both with light and shadow colors, eg. using complementary colors in light/shadow. Here's how I setup other shadow settings, and it works perfect. But I found no way to make shadows other than black / different shades of gray. this._sun_light = new THREE.DirectionalLight(0xffffff, 1); ... this._sun_light.intensity = this.getParameter("sun_intensity"); this._sun_light.color.setHex

问题 i need my text sprite to look more clear/strong (easiest to read), here is the code where i create it: var canvas1 = document.createElement('canvas'); var context1 = canvas1.getContext('2d'); context1.font = "Bold 8px Arial"; context1.fillStyle = "rgba(255,0,0,0.95)"; context1.fillText(text, 170, 60); var texture1 = new THREE.Texture(canvas1); texture1.needsUpdate = true; var spriteMaterial = new THREE.SpriteMaterial( { map: texture1, color: 0xffffff, fog: true } ); var sprite = new THREE

问题 I am using bullet/ammo.js with three.js. I have a 3d mesh and I want to use the exact shape for collision detection with a soft body. Is there a way I can create a 3d rigid body (in bullet) from a mesh (in three.js)? Here is an example: http://kidzinski.com/miamisura/lazy3d/ (please wait a second for the 3d model to download). I have a cloth falling on a 3d body and I need to simulate collision of this cloth with the body. I am new to these frameworks sorry if I fundamentally misunderstood

问题 I am trying to draw a least squares plane through a set of points in Three.js. I have a plane defined as follows: var plane = new THREE.Plane(); plane.setFromNormalAndCoplanarPoint(normal, point).normalize(); My understanding is that I need to take that plane and use it to come up with a Geometry in order to create a mesh to add to the scene for display: var dispPlane = new THREE.Mesh(planeGeometry, planeMaterial); scene.add(dispPlane); I've been trying to apply this answer to get the

问题 I have exported a model as a Three.js scene. I load it using ObjectLoader. It seems to load fine, but the textures are not applied. When I look at the json file, there are materials listed. Here is the code I have tried. loader.load( "MyModel.json", function(obj){ var materialsFromFile = new THREE.MeshFaceMaterial(obj.materials); // create our mesh with the loaded geometry and materials mesh = new THREE.Mesh(obj.geometry, materialsFromFile); scene.add(mesh); }); UPDATE: I have a fix for this,

问题 I am curious to know what the relationship is between gl_PointSize and the size property within PointCloudMaterial . When I create a PointCloud with PointCloudMaterial and set the size property to 1 , the size of the particles are far larger than when creating a PointCloud with a ShaderMaterial and setting the size parameter for the vertex shader to 1 . I also account for size attenuation like in the PointCloudMaterial shader: <script type="x-shader/x-vertex" id="particle_vs"> uniform float

问题 I've been playing around with Three.js for a little while, I'm currently handling mouse dragging the same way as in the draggable cubes example of three.js, with Trackball Controls to operate the camera, however these controls both seem to work on the assumption that I use the whole browser window for my application. Is there any way to scale (and restrict) these mouse controls to my canvas? EDIT: Here is a code sample showing the mouse events for dragging objects (it's actually pretty much