three.js

Collada model faces not displaying correctly in three.js

由 人走茶凉 提交于 2019-12-23 13:08:07
问题 After importing a collada model into three.js, some of the model's faces are only visible from the inside of the model and not from the outside. How can I fix the problem with the faces in question? Is it possible to have the model's faces visible from both sides? 回答1: The reason it doesn't work properly is because your file has this double_sided flag set: <effect id="material_3_4_0-effect" name="material_3_4_0-effect"> <profile_COMMON> ... <extra> <technique profile="GOOGLEEARTH"> <double

Drag a mesh over another and limit it within the sides three.js

由 大兔子大兔子 提交于 2019-12-23 12:58:18
问题 I have to create a house like structure where user will be able to add windows on wall. The approach I am thinking is to first create a separate mesh for window which user can drag over the selected wall of the house mesh, and drops where they feel it suitable, but within the same wall or same side of the house mesh. After that I will create the whole scene again but draw the window in the wall of the house mesh instead of creating a separate window mesh. Following is what it will look like

Three.js/GLSL - Convert Pixel Coordinate to World Coordinate

由 流过昼夜 提交于 2019-12-23 12:46:59
问题 I have a simple shader in my Three.js application that colors the screen red. However, I want to color all pixels to the right of a given world position to to a different color. I have seen some answers that suggest using varying vec4 worldCoord = gl_ModelViewMatrix * gl_Vertex; , but since WebGL using GLSLES, variables like gl_Vertex are not available to me. Vertex Shader <script type="x-shader/x-vertex" id="vertexshader"> #ifdef GL_ES precision highp float; #endif void main() { gl_Position

three.js cube black but i added texture?

由 我的梦境 提交于 2019-12-23 12:18:03
问题 I tried adding texture to my cube I made using JS/THREE.JS. But when I open it up in my browser its all black? This is my code: <html> <head> <title>My first Three.js app</title> <style>canvas { width: 100%; height: 100% }</style> </head> <body> <script src="https://rawgithub.com/mrdoob/three.js/master/build/three.js"></script> <script> // revolutions per second var angularSpeed = 0.2; var lastTime = 0; // this function is executed on each animation frame function animate(){ // update var

Can't clone() Texture

由 你。 提交于 2019-12-23 11:53:38
问题 Basicly, this works: var expl1 = new THREE.ImageUtils.loadTexture( 'images/explodes/expl1.png' ); this.material = new THREE.MeshBasicMaterial({ map: expl1, transparent:true, blending:THREE.AdditiveBlending }); And this doesnt... var expl1 = new THREE.ImageUtils.loadTexture( 'images/explodes/expl1.png' ); this.material = new THREE.MeshBasicMaterial({ map: expl1.clone(), transparent:true, blending:THREE.AdditiveBlending }); The problem is, i have multiple objects with this texture. I want to be

Logarithmic Depth Buffer + Orthographic Camera

由 风流意气都作罢 提交于 2019-12-23 11:47:39
问题 I'm trying to use the Logarithmic Depth Buffer with an Orthographic camera, and encountering some interesting results. I've constructed a sample here: http://jsfiddle.net/TheJim01/05up96m0/ The renderer on the left (the red knot) uses a standard linear depth buffer ( 1 to 1000 ). Selecting Perspective or Orthographic will re-render the scene with the selected camera type, and both appear to work as expected. The renderer on the right (the green knot) uses a logarithmic depth buffer ( 1e-6 to

Logarithmic Depth Buffer + Orthographic Camera

由 孤街醉人 提交于 2019-12-23 11:47:09
问题 I'm trying to use the Logarithmic Depth Buffer with an Orthographic camera, and encountering some interesting results. I've constructed a sample here: http://jsfiddle.net/TheJim01/05up96m0/ The renderer on the left (the red knot) uses a standard linear depth buffer ( 1 to 1000 ). Selecting Perspective or Orthographic will re-render the scene with the selected camera type, and both appear to work as expected. The renderer on the right (the green knot) uses a logarithmic depth buffer ( 1e-6 to

Odd artifacts and Empty texture in extruded shape in three.js

由 廉价感情. 提交于 2019-12-23 10:57:57
问题 I have tried to give 3D feeling to SVG paths (lineto and moveto) by extruding shapes using Three.js, but the process causes some artifacts that I cannot remove. What could cause odd artifacts in my rendered 3D shape? Is there a way to remove them? The artifacts are marked with arrows in the sample image below. The live example is here: http://jsfiddle.net/pHn2B/24/ And the code is here: // Picking with Callback // three.js r.52 var container, info, camera, scene, light, geometry, mesh,

Three.js - Good z distance of camera for full view of box

由 霸气de小男生 提交于 2019-12-23 10:16:48
问题 I display with Three.js a scene of size 700x700. In this scene, I generate a system of particles with random positions between -250 and 250 (for x,y,z), so the box is 500x500 size. to compute the right distance of camera (for an adapted full view of the box), I tried : <script> if ( ! Detector.webgl ) Detector.addGetWebGLMessage(); var container, stats; var camera, controls, scene, renderer; var cross; var width = 700, height = 700; init(); animate(); function init() { camera = new THREE

Can you share meshes between three.js Scenes?

由 元气小坏坏 提交于 2019-12-23 10:16:03
问题 Is it possible to share meshes or geometry between scenes? I have multiple scenes which should the same, big, meshes, but when I try to share meshes between them I get WebGL context errors. I suspect that some variables are set on the meshes or geometry when they are added to a scene, thus preventing them from being re-used in another scene. EDIT: More specifcally, I'm trying to share geometry that has been loaded with the JSONLoader between different scenes. I.e. in this example 'apps' is an
订阅 three.js