three.js

How can I load client .STL file into three.js scene instead of loading from server?

怎甘沉沦 提交于 2019-12-13 01:09:03
问题 I have a 'choose file' button I want to use for loading a client side file instead of loading from the server path in loader.load() on line 86. I'm guessing I need to use File API but haven't figured out how after looking at this solution. Existing web page that loads file from server path in line 86: <!DOCTYPE html> <html> <head> <style> body { background-color:#fea47c; } div { position:relative; left:200px; top:0px; background-color: #eeeeee; border:1px solid black; width:550px; height

Meteor.js can't reference Three.js

我是研究僧i 提交于 2019-12-13 00:54:41
问题 I'm trying to build an application with Meteor and Three.js but unfortunately pretty unsuccessful in binding the two parts together. Three.js is a library for WebGL visualization on the client side; somehow I can't reference it correctly in Meteor. Meteor either doesn't find it at all, if I place the .js in /public, or I get an error: ReferenceError: self is not defined at app/Three.js:2:47 when I place it in any other folder. I really have no idea why... Thanks! 回答1: I think you need to

Three.js, OBJLoader -> Uncaught ReferenceError: object is not defined

China☆狼群 提交于 2019-12-13 00:43:18
问题 My code below. When I uncomment object.rotation.y += ( targetRotation - object.rotation.y ) * 0.05; from render() or animate() function I get "Uncaught ReferenceError: object is not defined " error. I tried anything, my animate() function is even in loader callback, I tried changing three.js to older version (currently using r59), hoped var object = event.content; might solve it, no effect. I want to add "click and move your mouse to rotate model" usability, I have no problems with that when

Three.js object rotation pivot

谁说我不能喝 提交于 2019-12-13 00:37:14
问题 Here is my demo: http://www.edar.com.pl/test-3d/ var scene, camera, renderer, loader, ambient, directionalLight; var object; var windowHalfX = 300; var windowHalfY = 145; var targetRotation = 0; var targetRotationOnMouseDown = 0; var mouseX = 0; var mouseXOnMouseDown = 0; init(); function init() { container = document.createElement('div'); document.getElementById("3dbox").appendChild(container); scene = new THREE.Scene(); //camera = new THREE.PerspectiveCamera( 45, 600 / 290, 0.1, 100000 );

Rotation around an axis three.js

余生长醉 提交于 2019-12-13 00:32:22
问题 I'm using three.js Revision 69 and i've got a problem rotating objects around global axis. I've found on many website the function rotateAroundWorldAxis defined as follow: function rotateAroundWorldAxis( object, axis, radians ) { var rotationMatrix = new THREE.Matrix4(); rotationMatrix.makeRotationAxis( axis.normalize(), radians ); rotationMatrix.multiply( object.matrix ); // pre-multiply object.matrix = rotationMatrix; object.rotation.setFromRotationMatrix(object.matrix); } I've called

loading a file texture in FIRST frame of a feedback loop with swapped buffers in three.js

社会主义新天地 提交于 2019-12-13 00:30:28
问题 I'm working on a website in three.js using several feedback shader loops (texture pingpong). When someone visits the site, the loop should continue from a certain point (depending on when he/she visits). To achieve this I intend to load a picture (eg a jpeg) from the server in the first frame, render this to my pingpong buffers and continue with my normal feedback loop from frame 2 onwards. Here's a stripped down version of my problem, as a feedback function i simply add a small value to the

Scale object to fit inside certain bounding box three.js

北城余情 提交于 2019-12-12 21:47:25
问题 In my project i am loading different kinds of model dynamically. How to scale the loaded object so that it fits completely inside a certain bounding box? To clarify the situation, i do not want the loaded object to fit in my FOV. I already have a house loaded in my scene. I want the new loaded object to fit inside my house. 回答1: Since you do have the bounding box of the house (call it boxH) and the bounding box of the object (call it boxO), take the ratios of the bounding box sizes var sizeH

Positioning children objects in scene (car <-> wheels hierarchy)

一世执手 提交于 2019-12-12 21:26:23
问题 I need to add car model to scene with wheels as separated objects to allow their easy rotation and possible replacement. The question is wheels positioning - they need to be on exact places in relation to car body. How it can be done in proper way? In WebGL demos and TriggerRally there are existing wheel positions - they were predefined for 3D scene - but how? Can these positions be somehow mapped to Blender model coordinates? I've tried to separate one wheel from body, set pivot point to its

Three.js Image is not power of two warning

一个人想着一个人 提交于 2019-12-12 20:44:51
问题 I have a problem with this warning I'm getting from three.js. The warning is: THREE.WebGLRenderer: image is not power of two (600x480). Resized to 512x512 I have tried adding THREE.LinearFilter, but it does nothing. var texture = new THREE.TextureLoader().load(data[i]['image']); texture.minFilter = THREE.LinearFilter; var paintingGeometry = new THREE.BoxGeometry(1, 1, 1); var paintingMaterial = new THREE.MeshPhongMaterial({ map: texture }); var painting = new THREE.Mesh(paintingGeometry,

Three.js not scaling or rotating Mesh on render()

折月煮酒 提交于 2019-12-12 20:27:08
问题 I've been trying out Three.js today and I've had trouble getting my Mesh to change according using mesh.rotation.x += 10; for example. The code below renders a triangle and the camera moves around onMouseMove but inside the render() function, it fails to scale or rotate the Mesh obj . Appreciate the pointers. <body> <div id="container" style="border: #0f0 solid;"> </div> <script type="text/javascript"> var mouseX = 0, mouseY = 0; windowHalfX = window.innerWidth / 2, windowHalfY = window