如果我将四面体添加到这样的three.js场景中，如何校正它的倾斜度以使其底面平坦，重置y轴以便我可以正确旋转它？
//dummy object
var dummy = new THREE.Mesh( new THREE.CubeGeometry( 1, 500, 1 ), new THREE.MeshBasicMaterial() );
dummy.position.x = 0;
dummy.position.z = 0;
scene.add( dummy );
// tetrahedron
var points = [
new THREE.Vector3( 200, 0, 0 ), //bottom right
new THREE.Vector3( 0, 200, 0 ), //top
new THREE.Vector3( 0, 0, 200 ), //bottom left
new THREE.Vector3( 200, 200, 200 ) //bottom back
];
object = THREE.SceneUtils.createMultiMaterialObject( new THREE.ConvexGeometry( points ), materials );
object.position.set( -110, 0, -110 );
object.rotation.set( 0.7, 0.0, -0.7 );
dummy.add( object );
答案 0 :(得分：0)
@WestLangley，是的，我发现你在回复之前发布了几个小时并将其付诸实施（复制如下）。不完全理解tetrahedron.position.set( -115, 0, -115 )中的数学或者为什么x和z轴上的-115的偏移<!-- language: lang-js -->
<!DOCTYPE html>
<html lang="en">
<head>
<title>three.js webgl - convex geometry</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: #000;
margin: 0px;
overflow: hidden;
}
canvas { width: 500px; height: 500px }
</style>
</head>
<body>
<script src="three.min.js"></script>
<script src="js/geometries/ConvexGeometry.js"></script>
<script src="js/Detector.js"></script>
<script>
if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
var container;
var camera, scene, renderer;
init();
animate();
function init() {
container = document.createElement( 'div' );
document.body.appendChild( container );
camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 );
camera.position.y = 400;
scene = new THREE.Scene();
var light, object, materials;
scene.add( new THREE.AmbientLight( 0x404040 ) );
light = new THREE.DirectionalLight( 0xffffff );
light.position.set( 0, 1, 0 );
scene.add( light );
materials = [
new THREE.MeshLambertMaterial( { color: 0xffffff, wireframe: false, transparent: false, opacity: 0.5, wireframeLinewidth: 2, wireframeLinejoin: "miter" } )
];
//dummy line object
var dummy = new THREE.Mesh( new THREE.CubeGeometry( 1, 500, 1 ), new THREE.MeshLambertMaterial() );
dummy.position.x = 0;
dummy.position.z = 0;
scene.add( dummy );
//tetrahedron points
var points = [
new THREE.Vector3( 0, 0, 200 ), //bottom right
new THREE.Vector3( 0, 200, 0 ), //top
new THREE.Vector3( 200, 0, 0 ), //bottom left
new THREE.Vector3( 200, 200, 200 ) //bottom back
];
tetrahedron = THREE.SceneUtils.createMultiMaterialObject( new THREE.ConvexGeometry( points ), materials );
//fix the rotation so that the point of the tetrahedron points up
tetrahedron.applyMatrix( new THREE.Matrix4().makeRotationAxis( new THREE.Vector3( 1, 0, -1 ).normalize(), Math.atan( Math.sqrt(2)) ) );
//fix the offset
tetrahedron.position.set( -115, 0, -115 );
//add the tetrahedron to the dummy line object
dummy.add( tetrahedron );
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );
window.addEventListener( 'resize', onWindowResize, false );
}
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize( window.innerWidth, window.innerHeight );
}
function animate() {
requestAnimationFrame( animate );
render();
stats.update();
}
function render() {
var timer = Date.now() * 0.0001;
camera.position.x = 800;
camera.position.y = 500;
camera.position.z = 800;
camera.lookAt( scene.position );
for ( var i = 0, l = scene.children.length; i < l; i ++ ) {
var object = scene.children[ i ];
object.rotation.y = timer * 2.5;
}
renderer.render( scene, camera );
}
</script>
</body>
对于具有200的向量的四面体是正确的。这是反复试验，感觉更舒服，我明白要做什么计算，所以我可以改变尺寸。
RewriteBase /
RewriteRule ^sitemap.xml$ index.php?route=feed/google_sitemap [L]
RewriteRule ^googlebase.xml$ index.php?route=feed/google_base [L]
RewriteRule ^system/download/(.*) index.php?route=error/not_found [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !.*\.(ico|gif|jpg|jpeg|png|js|css)
RewriteRule ^([^?]*) index.php?_route_=$1 [L,QSA]
RewriteCond %{THE_REQUEST} \ /+index\.php\?_route_=([^\ &]+)
RewriteRule ^ /%1? [L,R]
RewriteCond %{HTTP_HOST} !^www\.
RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]
RewriteCond %{SERVER_PORT} 80
RewriteRule ^(.*)$ https://www.sitenamehere.net/$1 [R,L]