Hello there,
I am in need of expert help here. I have just started learning how to use three.js, I’d like to know if there is any way that i can create other 3D shapes? especially pyramid. The shape is made up from a list of names in a periodic table as you can see in the link I’ve attached below.
https://threejs.org/examples/?q=3d#css3d_periodictable
I’d appreciate it a lot if anyone could help me 
Thank you
There are many examples in the Collection of examples from discourse.threejs.org
e.g.
PictureBall
BufferGeometry
Planes on Sphere
https://hofk.de/main/discourse.threejs/2020/MovingObject/MovingObject.html
and many more. 
From three.js examples you got the sphere and others. You just have to calculate the geometry differently. Some math.
// sphere
var vector = new THREE.Vector3();
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();
object.position.setFromSphericalCoords( 800, phi, theta );
vector.copy( object.position ).multiplyScalar( 2 );
object.lookAt( vector );
targets.sphere.push( object );
}
UPDATE:
https://hofk.de/main/discourse.threejs/2018/BufferWithNormals/BufferWithNormals.html
A cool example of building of a tetrahedral pyraminx:
var phi = Math.acos( - 1 + ( 2 * i ) / l );
var theta = Math.sqrt( l * Math.PI ) * phi;
May i know how does the formula work to create the pyramid?
Thank youu
No, these formulas are for the sphere. But it is useful to understand the formulas for sphere and the other figures in https://github.com/mrdoob/three.js/blob/7c1424c5819ab622a346dd630ee4e6431388021e/examples/css3d_periodictable.html. Then you can better create new shapes.
You need the right formulas for each figure.
But in my case, i need to arrange the table into a pyramid shape …
@msyazwanmsaid
Do you already know how many sides our pyramid will have?
Some examples of explanatory pictures of the desired result will help to understand what a pyramid shape is.
The more details you put in explanation, the better help you’ll get.
I’m sorry if my explanation was not clear.
I’m aiming to create 5 sided pyramid with 5 vertices and 8 edges.
From the periodic table, it will transform to pyramid shape when i click “pyramid” button.
Cool!
Any ideas of how to achieve it?
Just some thoughts:
You’ve got a pyramid. 4 sides and 1 base. Sides are triangles, the base is a square.
There are 118 elements, so you need to know how to distribute them in the pyramid formation.
I’m not a mathematician, but I think that you’ll get such equation: x*x + 4 * y = 118.
In the first approximation you’ll get x = 5, y = 25, that’ll give 5 * 5 + 4 * 25 = 125 (the difference is 125 - 118 = 7, tolerable 
).
So, we’ve got 25 items per side. Suppose, we need to place them in rows, usning arithmetic progression (n + 2), thus we’ll have 5 rows (1, 3, 5, 7, 9, numbers are amount of items in each row). If 1 item is 1x1, then we have a triangle with 5 units heitght and 9 units in its base.
We’ve got 4 sides, then we can put on them 100 items. The rest 18 items are for the base of the pytamid.
Use two loops to put items in the formation of triangle, using that arithmetic progression.
All that stuff is just from the scratch 
It’s not that rocket science 
@msyazwanmsaid
Here is your pyramid of elements 
Built with conception from my previous post
https://jsfiddle.net/prisoner849/br138upL/
Now it’s yours and you’re on your own with it
Nice! This is what I’ve been looking for…
I really appreciate your willingness to help me solve my question.
Thank you so much!
