three.js

ThreeJS X Rotation behaving unexpectedly

由 纵饮孤独 提交于 2019-12-31 05:12:58
问题 I'm making a ThreeJS Demo, and I'm currently using the arrow keys to rotate the camera. At first things seem to work out ok. I can successfully rotate up and down, and left and right. However, when I turn to the left, and then try to rotate up or down, it rotates up and down, but NOT relative to my current position - it acts as if I hadn't rotated left at all. Here's my current render code: function render() { plane.rotation.y += 0.005; cube.rotation.z += 0.01; cube.rotation.y += 0.01; if

Three.js: Keeping child below parent mesh

由 自闭症网瘾萝莉.ら 提交于 2019-12-31 05:04:15
问题 I'm trying to create a table in Three.js but the legs of the table goes through the parent. Parent Mesh: const boxWidth = 2; const boxHeight = 0.1; const boxDepth = 1; const tableBoardGeometry = new THREE.BoxGeometry(boxWidth, boxHeight, boxDepth); const textureLoader = new THREE.TextureLoader(); const customPicture = textureLoader.load('https://threejsfundamentals.org/threejs/lessons/resources/images/compressed-but-large-wood-texture.jpg') const tableBoardMaterial = new THREE

Three.js - Why is csg.js not working?

由 谁说胖子不能爱 提交于 2019-12-31 04:22:09
问题 I tried to use csg.js-functions to cut a sphere out of a box, but it is not working? I read the tutorial on http://learningthreejs.com/blog/2011/12/10/constructive-solid-geometry-with-csg-js/ but its still not working. <html> <head> <title>Experiment</title> </head> <body> <script src="three_js\build\three.min.js"></script> <script src="ThreeCSG.js"></script> <script src="csg.js"></script> <script type="text/javascript"> var scene = new THREE.Scene(); var camera = new THREE.PerspectiveCamera(

Inverse kinematic animation

由 六眼飞鱼酱① 提交于 2019-12-31 00:52:10
问题 I'm trying to find or create a working example of inverse kinematic posing in three.js. Ideally I would like to export human models from Makehuman via their Collada exporter, load them with THREE.ColladaLoader and set them into different poses in three.js programmatically or through some dat.GUI interface. A bit like an artist doll implementation - I don't need animation, but real-time feedback when tweaking the pose would be nice, and inverse kinematic style posing would be highly preferred.

three.js EdgesHelper showing certain diagonal lines on Collada model

由 别说谁变了你拦得住时间么 提交于 2019-12-30 11:36:05
问题 I'm using EdgesHelper on a simple model that I exported from SketchUp. It is showing some diagonal lines like this: How do I prevent those lines from appearing, so that the edges looks like what it appears in SketchUp? I tried setting the thresholdAngle but it doesn't help. Update: Working demo: http://jsfiddle.net/alan0xd7/6vLm5xsa/ This is the look I am trying to achieve: 回答1: You are rendering both the model and the edges helper in a scene without lights. Remove the model and you can see

Many meshes with the same geometry and material, can I change their colors?

由 跟風遠走 提交于 2019-12-30 07:55:08
问题 I have a large number (~1000) of THREE.Mesh objects that have been constructed from the same THREE.Geometry and THREE.MeshPhongMaterial (which has a map). I would like to tint (color) these objects individually. Naïvely, I tried changing the mesh.material.color property, but changing this property on any of the objects changes the color of all the objects at once. This makes sense, since there is only one material that is shared among all the objects. My next idea was to create a separate

Convert .obj to .js files

由 三世轮回 提交于 2019-12-30 07:34:32
问题 I have gone through different three.js examples. Some of the examples uses .js or .bin files instead of .obj files. e.g. used in webgl_materials_cars.html example. How do I get .js file for my .obj file? 回答1: The Three.js editor. Converter. Blender exporter. Clara.io. Various other converters and exporters 来源： https://stackoverflow.com/questions/29114485/convert-obj-to-js-files

THREE.js dynamically add points to a Points geometry does not render

由 倾然丶 夕夏残阳落幕 提交于 2019-12-30 07:17:12
问题 I am using Three.js r83. I am trying to dynamically add points to a geometry, but the scene never gets updated. This works : var tmaterial = new THREE.PointsMaterial({ color: 0xff0000, size: 5, opacity: 1 }); var tgeometry = new THREE.Geometry(); var pointCloud = new THREE.Points(tgeometry, tmaterial); for(var i = 0; i< 1000; i++) { x = (Math.random() * 200) - 100; y = (Math.random() * 200) - 100; z = (Math.random() * 200) - 100; tgeometry.vertices.push(new THREE.Vector3(x, y, z)); }

THREE.js dynamically add points to a Points geometry does not render

由 百般思念 提交于 2019-12-30 07:17:05
问题 I am using Three.js r83. I am trying to dynamically add points to a geometry, but the scene never gets updated. This works : var tmaterial = new THREE.PointsMaterial({ color: 0xff0000, size: 5, opacity: 1 }); var tgeometry = new THREE.Geometry(); var pointCloud = new THREE.Points(tgeometry, tmaterial); for(var i = 0; i< 1000; i++) { x = (Math.random() * 200) - 100; y = (Math.random() * 200) - 100; z = (Math.random() * 200) - 100; tgeometry.vertices.push(new THREE.Vector3(x, y, z)); }

three.js: from plane-orthogonal vector to plane rotation matrix

由 无人久伴 提交于 2019-12-30 07:00:12
问题 I want to set the rotation of a plane. This requires three numbers denoting the rotation in radians in the x, y and z axes. I don't have these numbers, but, I have a vector 'myVec' that shall be orthogonal to the plane once it has been rotated. This vector brings me one step closer, but not fully there: THREE.Vector3 provides a function "setEulerFromRotationMatrix". Maybe I could use this, if I could figure out how to generate a rotation matrix from myVec: A rotation matrix describes how one
订阅 three.js