three.js

Loading JSON exported from THREE.js editor

倖福魔咒の 提交于 2020-01-06 02:52:09
问题 var container; var camera; var scene; var renderer; var mesh; var loader; init(); function init(){ camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHieght, 1 , 10000); camera.position.z = 1000; //scene scene = new THREE.Scene(); loader = new THREE.ObjectLoader(); loader.load( "chesstable.js", function( mesh ) { mesh.scale.set( 1,1,1); scene.add(mesh); } ); renderer = new THREE.CanvasRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body

Can't get collision detection or onclick to work in THREE.js

◇◆丶佛笑我妖孽 提交于 2020-01-06 01:56:10
问题 I've spent 2 days now trying to get this collision detection and click on object to work, with some luck but not close to perfect. I want to detect the camera's collision with objects as it moves around the scene (like if it were a shuttle and it would go boom if you ran into a planet or sphere). Any help would be greatly appreciated. FYI, ShipControls are a clone of FlyControls (slightly modified). Example: http://www.benmarshall.me/projects/playground/solar-system/index2.html 回答1: Ray doesn

Threejs issue with raycaster intersection

独自空忆成欢 提交于 2020-01-05 12:33:06
问题 I wrote a code to intersect some object and worked fine until I put canvas with other div in html document. Now there are no intersection on the object. In this Live example:http://www.felpone.netsons.org/web-threejs/index1.html if you select on the right top the button cross and try to move the shape you can't. You can move shape if you put your mouse a little bit at right of the shape. So the intersection is completely wrong. I tried some solutions posted on stackoverflow but doesn't work.

Threejs issue with raycaster intersection

情到浓时终转凉″ 提交于 2020-01-05 12:33:02
问题 I wrote a code to intersect some object and worked fine until I put canvas with other div in html document. Now there are no intersection on the object. In this Live example:http://www.felpone.netsons.org/web-threejs/index1.html if you select on the right top the button cross and try to move the shape you can't. You can move shape if you put your mouse a little bit at right of the shape. So the intersection is completely wrong. I tried some solutions posted on stackoverflow but doesn't work.

Three.js material isn't applied correctly to hexagonal faces

让人想犯罪 __ 提交于 2020-01-05 12:28:11
问题 I have a mesh, created in blender and exported to .obj. The mesh looks valid and has UV map applied and exported into the same .obj as well. For some reason, when I try to apply a texture material, or even basic material to the mesh, only half of the hexagon is actually painted. This is a mesh This is the code var container; var camera, scene, renderer; init(); animate(); function init() { container = document.createElement( 'div' ); document.body.appendChild( container ); renderer = new

Three.js: Cannot change value in dat.GUI

不想你离开。 提交于 2020-01-05 10:32:08
问题 i have an instance of dat.GUI. I added a "comboBox" to that instance to make a selection of possible values. When i run my app, the dat.GUI appears with the comboBox but there is a problem: I cannot change it's default value (my gui is frozen), here is my code: <html> <head> <title>Stack Overflow</title> <style> body { margin: 0; } canvas { width: 100%; height: 100% } </style> </head> <body> <div id="container"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min

ThreeJS texture issue

孤人 提交于 2020-01-05 10:20:43
问题 I have a problem with my Three.js 3D application - at least according to some people I know. My application rests at [http://176.9.149.205/planungstool/] . Some people who supposedly have the most recent version of Chrome and Firefox, can not see the textured areas. For example, they do not see the roof or front of the 3D house. They do, however, see the non-textured stuff like the tree or the floor. What's weird is that I don't have that problem and most of the other people I asked do not

Three.js MeshBasicMaterial doesn't work as expected

回眸只為那壹抹淺笑 提交于 2020-01-05 10:07:11
问题 I am trying to create a texture with Three.js. My source of texture_f1 is a .png file witch means you can see the background through it. The problem is that if i try to set background color: 0xffffff it doesn't work in combination with map:. If i set only the color:0xffffff , it return a white, but when use with map: like this var material_f1 = new THREE.MeshBasicMaterial({ map: texture_f1, color: 0xffffff}); i can see the background through the .png black . 回答1: If you have a transparent

three-mtl-loader error: THREE.MeshPhongMaterial: .shading has been removed -> object not visible

ぃ、小莉子 提交于 2020-01-05 09:02:39
问题 Yesterday I asked this question (Uncaught TypeError: THREE.MTLLoader is not a constructor 2.0), which I thought that I had finally gotten to work, but now new questions have instead emerged: I have installed 'three-mtl-loader' using npm, but now it seems that the object isn't visible, eventhough I can console.log my way into seeing that the object exists. For some reason it now spits out the following error, and I guess that that is why it is not visible: THREE.MeshPhongMaterial: .shading has

Threejs: Rotate sphere(globe) to another point(city) on the sphere itself

时光毁灭记忆、已成空白 提交于 2020-01-05 08:52:06
问题 I'm building a globe(sphere geometry) with set of predefined locations on geo-mapped and drawn as point(sphere geometry). I would like to focus(moving one location to another) those locations by rotating globe along y-axis. I tried the following code, seems not working for all locations. location.geometry.computeBoundingBox(); var position = new THREE.Vector3(); position.subVectors( location.geometry.boundingBox.max, location.geometry.boundingBox.min ); position.multiplyScalar( 0.20 );