var vector = new THREE.Vector3(); var spherical = new THREE.Spherical(); for ( var i = 0, l = objects.length; i < l; i ++ ) { var phi = Math.acos( -1 + ( 2 * i ) / l ); var theta = Math.sqrt( l * Math.PI ) * phi; var object = new THREE.Object3D(); spherical.set(1000, phi, theta ); object.position.setFromSpherical( spherical ); vector.copy( object.position ).multiplyScalar( 2 ); object.lookAt( vector ); }

This code describes the round sphere three.js. How to make a decagon from this?

  • Homework must be done independently. If you have a question about homework, do not ask him to do it for you. Ask a specific question about a problem that you cannot solve. Programming is something that you need to understand yourself, or not to do it at all. If programming for you is a superfluous subject in the curriculum, there are sites and people on these sites that perform tasks for material rewards. Here to offer to do the work for you and vice versa - moveton. - user218976
  • By assignment I can suggest an idea - first build the correct pentagon, then build the pentagon again, starting from the opposite side of the circle - user218976

1 answer 1

THREE.CircleGeometry() can be used:

 var decagonGeom = new THREE.CircleGeometry(5, 10); // первый аргумент - радиус, второй - количество радиальных сегментов. var mesh = new THREE.Mesh(decagonGeom, new THREE.MeshBasicMaterial({color: "blue"}));

If suddenly there is a need to make a simple contour, then for ordinary geometry, the .shift() call on the array of vertices is suitable:

 var decagonGeom = new THREE.CircleGeometry(5, 10); decagonGeom.vertices.shift(); var contour = new THREE.LineLoop(decagonGeom, new THREE.LineBasicMaterial({color: "yellow"}));

If you need to put objects in the formation "decagon", you can use the method .applyAxisAngle() :

 var scene = new THREE.Scene(); var camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000); camera.position.set(0, 0, 10); var renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); var radius = 5; var rotVector = new THREE.Vector3(0, radius, 0); var axis = new THREE.Vector3(0, 0, 1); var angleStep = THREE.Math.degToRad(36); // 1/10 of 360 for (let i = 0; i < 10; i++) { var mesh = new THREE.Mesh(new THREE.PlaneBufferGeometry(1, 1), new THREE.MeshBasicMaterial({ color: Math.random() * 0x777777 + 0x777777 })); mesh.position.copy(rotVector).applyAxisAngle(axis, angleStep * i); scene.add(mesh); } render(); function render() { requestAnimationFrame(render); renderer.render(scene, camera); } 
 body { overflow: hidden; margin: 0; } 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/94/three.min.js"></script>