Hi all,

this is the scenario: I have a sphere made up of an array of vec3 vertices.

When I click a button, I want that the whole sphere rotates in a way that the vertex I selected gets positioned in the center of the screen, so in world coordinates x and y should be 0. I cannot use the rotate function built in P5, so I made my own rotate functions for the 3 axis.

This is what I have until now, but clearly doesn’t work:

```
m4.rotateTowardPoint = function(vertices, index) {
let point = vertices[index];
let normal = p5.Vector.sub(point, m4.createVector(0,0,0));
let upVector = m4.createVector(0,0,-1);
let n = normal.normalize();
let angleOfRotation = n.angleBetween(upVector);
let axisOfRotation = p5.Vector.cross(n, upVector);
m4.verticesRotated = vertices.slice(0);
rotateX3D(angleOfRotation*axisOfRotation.x, m4.verticesRotated);
rotateY3D(angleOfRotation*axisOfRotation.y, m4.verticesRotated);
}
```

My rotate funcions:

```
function rotateZ3D(t, xyz) {
const c = Math.cos(t), s = Math.sin(t), len = xyz.length;
for (let i = 0; i < len; i += 1) {
const x = xyz[i].x, y = xyz[i].y;
xyz[i].x = x*c - y*s;
xyz[i].y = y*c + x*s;
}
}
function rotateY3D(t, xyz) {
const c = Math.cos(t), s = Math.sin(t), len = xyz.length;
for (let i = 0; i < len; i += 1) {
const x = xyz[i].x, z = xyz[i].z;
xyz[i].x = x*c - z*s;
xyz[i].z = z*c + x*s;
}
}
function rotateX3D(t, xyz) {
const c = Math.cos(t), s = Math.sin(t), len = xyz.length;
for (let i = 0; i < len; i += 1) {
const y = xyz[i].y, z = xyz[i].z;
xyz[i].y = y*c - z*s;
xyz[i].z = z*c + y*s;
}
}
```

Thank you for any help!