three.js

How to calculate fov for the Perspective camera in three js?

由 假装没事ソ 提交于 2019-12-20 07:25:37
问题 I want to set CubeGeometry touch to the canvas and I used this fov Formula but it didn't work out. This CubeGeometry is going out of canvas. var height = 500; var distance = 1000; var fov = 2 * Math.atan((height) / (2 * distance)) * (180 / Math.PI); itsLeftCamera = new THREE.PerspectiveCamera(fov , 400 / 500, 1.0, 1000); If I am calculating wrong so, please guide me how to overcome this problem? and I want to set this in generalize way so at any position of Perspective camera, this geometry

Three.JS- STL Loader - Uncaught TypeError: Cannot read property 'scale' of undefined

由 假如想象 提交于 2019-12-20 07:21:09
问题 I am loading five elements with STL Loader to create a table. I am trying to apply dat.gui to Tabletop.STL to adjust scale of it. Below is the code <!DOCTYPE html> <html lang="en"> <head> <title>three.js webgl - STL</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> <style> body { font-family: Monospace; background-color: #000000; margin: 0px; overflow: hidden; } #info { color: #fff; position: absolute;

Lightmaps in Three.js

由 血红的双手。 提交于 2019-12-20 07:06:24
问题 Lightmaps live independently of other textures, right? So I have to set up a second set of UVs. I have exported my JSON object with a second set of UVs and added the following. geometry.faceVertexUvs[0] = geometry.faceVertexUvs[1]; I got no working results. What I'm missing? Maybe someone can wise me a direction. Three.js r.73 loader.load("model.js", function(geometry){ geometry.faceVertexUvs[0] = geometry.faceVertexUvs[1]; var mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial( {

Fragment shader on plane with modified vertices

由 冷暖自知 提交于 2019-12-20 06:57:51
问题 I have a PlaneGeometry and I'm randomly animating the vertices in order to create random spikes. I use this FragmentShader : void main() { vec3 light = vec3(cos(time),sin(time),1.0); light = normalize(light); float dProd = max(0.0, dot(vNormal, light)); gl_FragColor = vec4(dProd,dProd,dProd,1.0); } I expected to have some faces of each spike colored in black, but instead I got a solid color. I placed a Sphere on my plane and applied the same shader: When I turn the wireframe OFF : Not sure I

Fragment shader on plane with modified vertices

由 一曲冷凌霜 提交于 2019-12-20 06:57:33
问题 I have a PlaneGeometry and I'm randomly animating the vertices in order to create random spikes. I use this FragmentShader : void main() { vec3 light = vec3(cos(time),sin(time),1.0); light = normalize(light); float dProd = max(0.0, dot(vNormal, light)); gl_FragColor = vec4(dProd,dProd,dProd,1.0); } I expected to have some faces of each spike colored in black, but instead I got a solid color. I placed a Sphere on my plane and applied the same shader: When I turn the wireframe OFF : Not sure I

Fragment shader on plane with modified vertices

由 核能气质少年 提交于 2019-12-20 06:56:55
问题 I have a PlaneGeometry and I'm randomly animating the vertices in order to create random spikes. I use this FragmentShader : void main() { vec3 light = vec3(cos(time),sin(time),1.0); light = normalize(light); float dProd = max(0.0, dot(vNormal, light)); gl_FragColor = vec4(dProd,dProd,dProd,1.0); } I expected to have some faces of each spike colored in black, but instead I got a solid color. I placed a Sphere on my plane and applied the same shader: When I turn the wireframe OFF : Not sure I

Transparency within instanced shapes

由 女生的网名这么多〃 提交于 2019-12-20 05:56:06
问题 I've been playing with THREE.InstancedBufferGeometry . I finally got an example to work, and have now been playing with the shader. The first thing I tried was setting transparency. My example code is below. The initial state, and from a host of other camera angles (e.g. drag your mouse to the left), the transparency doesn't seem to have any effect. But then at other camera angles (e.g. reload and drag your mouse to the right), the shapes clearly overlap, which is what I was expecting. Is

Three.js StereoEffect displays meshes across 2 eyes

由 有些话、适合烂在心里 提交于 2019-12-20 05:40:41
问题 I have a THREE.js scene using StereoEffect renderer. However, when I add new meshes to the scene, they are displayed across the two eyes instead of being duplicated for each eye. I believe THREE.js is supposed to do it automatically and I don't have to duplicate them myself ? (I tried duplicating them but it is a lot of annoying calculation and I could not manage it) My meshes are actually transparent planes, and I add a DOM element on the top of them to have a flat display. Illustrating

Threejs - How to offset all points on a 2d geometry by distance

由 自闭症网瘾萝莉.ら 提交于 2019-12-20 05:40:11
问题 Using Three.js, (although I believe this is more math related) I have a set of 2D points that can create a 2D geometry. such as square, rectangle, pentagon, or custom 2D shape. Based of the original 2D shape, I would like to create a method to offset the points inward or outward uniformly in such a way like the attached image. I don't know if there is a simple way to offset/grow/shrink all the points (vector3) uniformly on the 2D shape inward or outward. And if so, it'll be cool if I can

What is the simplest way to draw a cylinder with a slice cut out of it with three.js?

由 廉价感情. 提交于 2019-12-20 05:36:09
问题 I was wondering how you would draw a cylinder with a slice cut out of it using three.js i.e. something like this: Image All replies are much appreciated. 回答1: Probably the easiest way to get the shape you want is to extrude a THREE.Shape like so: var settings = { amount: 2, steps : 1, bevelEnabled: false, curveSegments: 24 }; var shape = new THREE.Shape(); shape.moveTo( 0, 0 ); shape.absarc( 0, 0, 10, 0, Math.PI * 1.75, false ); shape.moveTo( 0, 0 ); var geometry = new THREE.ExtrudeGeometry(
订阅 three.js