three.js

问题 I'm attempting to adopt the threejs example for wireframes ( https://threejs.org/examples/?q=wire#webgl_materials_wireframe ) using WebGL instancing. This simple reproduction codepen ( https://codepen.io/ubermario/pen/gzByjP?editors=1000 ) shows that a wireframed cube is rendered when a 'center' attribute is passed to the vertex/fragment shaders with THREE.BufferAttribute. However, it is not renedered as wireframe when the 'center' attribute is passed to the same shaders with THREE

问题 I'm using an image as a texture several times, once via the material component, another time in a custom component. In the latter I'm using THREE.TextureLoader() which cause the application to load the image twice . I bet there's another way. Current situation HTML <!-- Assets --> <a-assets> <img id="my-map" src="path/to/map.jpg"> <a-asset-item id="my-model" src=path/to/model.gltf""></a-asset-item> </a-assets> <!-- Entities --> <a-box material="src: #my-map"> <a-entity gltf-model="src: #my

问题 It is probably a beginner question, but why does the plane appear to be flat? Why is the structure of the plane not visible, only the spikes on the edges? http://codepen.io/asz/pen/GgXpXW var geometry = new THREE.PlaneBufferGeometry( 100, 100, 50, 50 ); var vertices = geometry.attributes.position.array; for ( var i = -1; i < vertices.length; i += 3) { vertices[i] = Math.random() * 10; } geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2.8 ) ); var material = new THREE

问题 In Three.js, wow do I add or put limits on how far left/right/up/down a user can pan when using OrbitControls? I'd prefer not to be able to pan so far away that you are unable to see the objects in the scene. 回答1: In the current version of OrbitControls.js, the position is updated with the panning changes here. Now if you want to limit the panning to some boundaries, you can simply check if the new position of the camera lies within this boundaries, otherwise you do not update the position:

问题 QUESTION: Everything was working fine: I converted my FBX files to GLTF inside my /GLTF/ subfolder. Sadly, some geometry was missing from some of the converted files, so I tried to convert again my FBX files, this time to /TEST/. Suddenly, the models don't load and from my console.log statement: console.log( 'An error happened: '+JSON.stringify(error) ); I get this strange useless error: An error happened: {"isTrusted":true} So I try to convert my FBX files to .glb instead, this time to

问题 I'm trying to draw a boundingbox around a skinned model: const box = new THREE.BoxHelper(trooper, 0xff0000); scene.add(box); https://jsfiddle.net/66sor15y/4/ As you see the model doesn't fit the bounding box. I filed an issue to understand the problem, but I still have issues drawing the actual box. https://github.com/mrdoob/three.js/issues/13989 Any help would be highly appreciated! 来源： https://stackoverflow.com/questions/50173778/three-js-draw-bounding-box-around-skinnedmesh

问题 I'm quite new to Three.js so I'm not sure if it's possible to do this: I want to display multiple images over a plane geometry (some of them will appear multiple times). Imagine the next simplified case: +---+---+---+ | 1 | 2 | 3 | +---+---+---+ | 4 | 1 | 6 | +---+---+---+ | 1 | 1 | 9 | +---+---+---+ I'm creating the plane with it's divisions and applying a MeshBasicMaterial (contained inside a MeshFaceMaterial) to its faces. Each pair of faces has assigned one of the available images, ie:

问题 I am trying to visualize a spatial network and I am wondering if it is possible to change the color of individual line segments (edges in my case) in THREE.LineSegments . I am aware that I can pass individual colors if I define separate THREE.Line meshes for each segment, but I --am otherwise new to the subject and-- would also like to avoid the performance penalty this latter method incurs --given the problem size. I would appreciate if you would point me in the right direction in case there

问题 I've been wondering is it possible to do skinning to the 3d text with loaded images as texture? I knew you could do it with cubes and others since most of the sample were showing tutorials how to do it. What did I tried was map it with THREE. ImageUtils.loadTexture directed from the path but what did i get is some transparency object. I wonder how to use the same concept such as: CubeGeometry(width, height, depth, widthSegments, heightSegments, depthSegments, listofmaterials) in TextGeometry

问题 I'm trying to render a three.js box that has custom textures which I'm loading using THREE.TextureLoader() . While I see THREE.WebGLRenderer 87 in my console, there doesn't seem to be any cube being rendered. I've created a fiddle to show how I'm attempting to do it: http://jsfiddle.net/hfj7gm6t/4786/ Note that I'm just using one url for all 6 side's textures for simplicity's sake. Can anybody please help me understand why my beloved cube isn't showing? 回答1: First you need a render loop, you