three.js

Force a sprite object to always be in front of skydome object in THREE.js

由 偶尔善良 提交于 2019-12-24 12:33:44
问题 I currently have a custom shader draw a gradient on a skydome and would like to have a sun/moon in front of the skydome (from users perspective). The easiest way to do this is to have sprites for the sun and moon but the problem that arises is that the sprites get lodged within the skydome (sprite is partway in front and partway in back of the skydome). I have attempted to solve this with polygonoffset, but that doesn't seem to work on sprite objects. So my question is, how can I setup a sun

Custom shader - Three.js

由 六月ゝ 毕业季﹏ 提交于 2019-12-24 12:33:03
问题 I am trying to use a custom shader with Three.js. I tried to do it like the many examples, but it doesn't work. My code is: var vertex = "void main(){vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );gl_Position = projectionMatrix * mvPosition;}"; var fragment = "precision highp float;void main(void){gl_FragColor = vec4(0.0,1.0,0.0,1.0);}"; material = new THREE.ShaderMaterial({ vertexShader: vertex, fragmentShader: fragment }); var mesh = new THREE.Mesh(geometry,material); …and

How to run sample Threejs VR project using local server?

由 ♀尐吖头ヾ 提交于 2019-12-24 12:13:00
问题 I am trying to run sample threejs project for VR using xampp local server in Samsung NOTE 4 device.In this phone, online threejs VR examples(https://threejs.org/examples/?q=vr#webvr_cubes) working fine, but same example in our local server link(http://192.168.1.2/three.js-dev/examples/?q=vr#webvr_cubes) always returns "Your browser does not support WebVR". Can any one give me suggestions or idea how to run that sample project using xampp local server Thanks in Advance 回答1: At this time, WebVR

Is there ANY way to have the three.js camera lookat being rendered off-center?

由 杀马特。学长 韩版系。学妹 提交于 2019-12-24 12:06:43
问题 Is there a way to setup the Three.js renderer in such a way that the lookat point of the camera is not in the center of the rendered image? To clarify: image a scene with just one 1x1x1m cube at ( 0, 0, 0 ). The camera is located at ( 0, 0, 10 ) and the lookat point is at the origin, coinciding with the center of the cube. If I render this scene as is, I might end up with something like this: normal render However I'd like to be able to render this scene in such a way that the lookat point is

How to render geojson with three.js and d3.js

由 瘦欲@ 提交于 2019-12-24 12:02:49
问题 I use three.js r49, d3.v2.js and d3-threeD.js i want to render my city(Mashhad) with three.js but i got a problem i can render europian countries with these codes but i cant render with existing json file. d3.js Ref d3-threeD.js Ref these are my codes: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>GEO Bar</title> <link rel="stylesheet" href=""> <script type="text/javascript" src="./scripts/jquery-1.7.2.js"></script> <script

Three.js self transparency with intersecting polygons

由 孤人 提交于 2019-12-24 11:42:37
问题 I'm trying to make a simple tree billboard of two crossed planes with a partially transparent texture. The self-transparency only works for one plane, I'm assuming because of depth-sorting problems when geometry intersects. See here: https://jsfiddle.net/2q5a7fzy/21/ The geometry is fairly simple: geometry.vertices.push( new THREE.Vector3( -1, -1, 0 ), new THREE.Vector3( -1, 1, 0 ), new THREE.Vector3( 1, 1, 0 ), new THREE.Vector3( 1, -1, 0 ), new THREE.Vector3( 0, -1, -1 ), new THREE.Vector3(

Edgeshelper not updating position of mesh

由 天大地大妈咪最大 提交于 2019-12-24 11:40:26
问题 I would like to draw a coloured box, including the edges (in a different colour) This is the code I am using to create the box and edges. I have added them both to a object3D since I will have a number of differnt objects in the scene and would like to enforce encapsulation. var mesh = new THREE.Mesh( geo, material ); var edge = new THREE.EdgesHelper( mesh, 0xffffff ); var container = new THREE.Object3D(); container.add(mesh); container.add(edge); scene.add(container); The above posted code

when scene is really rendered out using three.js

由 二次信任 提交于 2019-12-24 11:31:04
问题 I'm making a progress bar such as "loading" in a scene with three.js. But when is the scene really loaded?Render is doing its work all the time and the Loader's callback option just work when the images get loaded from network.And i can't find a callback function option where the scene is really loaded or rendered out. So where or when is the callback function should be called? 来源： https://stackoverflow.com/questions/28229618/when-scene-is-really-rendered-out-using-three-js

THREEJS - Indexed BufferGeometry with 2 materials

由 一笑奈何 提交于 2019-12-24 11:28:57
问题 I want to create ONE single buffer geometry that can hold many materials. I have read that in order to achieve this in BufferGeometry, I need to use groups. So I created the following "floor" mesh: var gg=new THREE.BufferGeometry(),vtx=[],fc=[[],[]],mm=[ new THREE.MeshLambertMaterial({ color:0xff0000 }), new THREE.MeshLambertMaterial({ color:0x0000ff }) ]; for(var y=0 ; y<11 ; y++) for(var x=0 ; x<11 ; x++) { vtx.push(x-5,0,y-5); if(x&&y) { var p=(vtx.length/3)-1; fc[(x%2)^(y%2)].push( p,p-11

Different orientation for PlaneBufferGeometry in chrome vs. firefox

由 孤者浪人 提交于 2019-12-24 11:27:57
问题 I've created a sample to show what I'm seeing: https://haddons.net/threejs/chrome_firefox.html I have a basic model that's loading a texture onto a plane and also pulling in some heightmap data. If I load it in chrome the texture is oriented in one direction and if I load it in firefox it's rotated 180 degrees. Am I doing something wrong or is this a firefox, chrome or three.js bug? 回答1: Unfortunately, this is a bug in the current version of three.js ( R102 ). It will be fixed with the next
订阅 three.js