three.js

问题 See example: http://jsfiddle.net/pehrlich/nm1tzLLm/2/ In newer versions of THREE.js, if I call render before adding additional objects to the scene, they will never be visible, even with additional calls to render. Is this expected behavior? See full code: var cube, cube2, geometry, light, material, renderer; window.scene = new THREE.Scene(); window.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 10000); renderer = new THREE.WebGLRenderer(); renderer

问题 I would like to use one geometry object for some fancy particle animation and display lines between those particles. geometry = new THREE.Geometry(); particles = new THREE.ParticleSystem(geometry, particleMaterial); line = new THREE.Line(geometry, lineMaterial, THREE.LinePieces); Somehow the Line Object is not rendered in the scene, but the particles show up. http://jsfiddle.net/Pk85y/1/ 回答1: With WebGLRenderer you can't share geometry in some specific situations. Best option is to do

问题 I'm starting to learn ThreeJS. I have some very complex models to display. These models come from Autocad files that my customer provides. But sometimes the amount of details in the model is just way too much for the purpose of the website. I would like to reduce the amount of vertexes in the model to simplify the display and enhance performance. Is this possible from within ThreeJS? Or is there maybe an other solution for this? 回答1: There's a modifier called SimplifyModifier that works very

问题 If I have a mesh modeled in Cinema 4D , how can I export it for the three.js 3D JS Engine ? Also, it would be handy to export material colors for polygon selections . 回答1: Just wrote another python script for Cinema4D for this. You can find details on the disturb media blog and wiki. For reference, I'm listing the source here too: ''' author : "George Profenza" url : ("disturb", "disturbmedia.com/blog","My blog, http://tomaterial.blogspot.com") Export meshes the three.js 3D Engine by mr.doob

问题 I want a material with: Textures Not receiving lights Receiving shadows I tried with the following library materials: MeshBasicMaterial: Does not support shadows MeshLamberMaterial: If you disable lights (material.lights = false) it also disables shadows ShadowMaterial: Does not support textures Is a custom ShaderMaterial the only way to achieve it? 回答1: In three.js, as in real life, shadows are the absence of light. So for a built-in three.js material to receive shadows, it must respond to

问题 for ( var i = 0; i < 100; i ++ ) { var particle = new THREE.Particle( new THREE.ParticleCanvasMaterial( { color: 0x666666, program: programStroke } ) ); particle.position.x = Math.random() * 800 - 400; particle.position.y = Math.random() * 800 - 400; particle.position.z = Math.random() * 800 - 400; particle.scale.x = particle.scale.y = Math.random() * 10 + 10; scene.add(particle); scene.children[i].id = "q"+i; // to select item using document.getElementById(); } projector = new THREE

问题 I have just encountered a scenario in the project I am building in which I needed to generate wireframe-style lines with a transparent inside to "outline" the shape as if it is drawn in a comic/cartoon style, instead of creating the actual solid object itself. These outlines need to be thicker than the default linewidth of LineBasicMaterial . It was a known issue that linewidth did not actually work/do anything for LineBasicMaterial , and so I was stumped on how I would solve my issue. I was

问题 I'm trying establish why I can't smooth shade geometry loaded with OBJLoader. var loader = new THREE.OBJLoader(manager); loader.load('/manmodel/js/man.obj', function (object, materials) { console.log(object); console.log(materials); man = object; man.traverse(function (child) { if (child instanceof THREE.Mesh) { child.geometry.computeFaceNormals(); child.geometry.computeVertexNormals( true ); child.material = new THREE.MeshPhongMaterial({ color: 'white', shading: THREE.SmoothShading // <-----

问题 I am trying to to use a texture from my own hosted webserver but putting it into the asset-item tag I get the following error. > Access to Image at 'http://192.168.137.1:3000/cat2.jpg' from origin > 'http://localhost' has been blocked by CORS policy: No > 'Access-Control-Allow-Origin' header is present on the requested > resource. Origin 'http://localhost' is therefore not allowed access. The picture is accessible, since I can see it in the webinspector. It works perfectly in a simple image

问题 I need to calculate the area/surface of a whole object in threeJS. Thats what I have: var _len = object.geometry.faces.length, _area = 0.0; if (!_len) return 0.0; for (var i = 0; i < _len; i++) { var va = object.geometry.vertices[object.geometry.faces[i].a]; var vb = object.geometry.vertices[object.geometry.faces[i].b]; var vc = object.geometry.vertices[object.geometry.faces[i].c]; var ab = vb.clone().sub(va); var ac = vc.clone().sub(va); var cross = new THREE.Vector3(); cross.crossVectors(