How to place randomly a box on a sphere

Questions
,
1

hi everybody,

i 'm a newbie and i 'm trying to place randomly a box on a sphere (directly on the surface). i see a lot of complicated method…(quaternion,etc…)
is there a easy way to achieve that ?

i have made this fiddle if you want to help me :slight_smile:
https://jsfiddle.net/e7bmzdLc/

thanks a lot

2

Hi!
Use the latest revision of the framework (r97), and then you can do something like that:

var box = new THREE.Mesh(new THREE.BoxGeometry(0.2, 0.2, 0.2), new THREE.MeshBasicMaterial({color: "red", wireframe: true}));
box.position.setFromSphericalCoords(radius + 0.1, THREE.Math.degToRad(23), THREE.Math.degToRad(23));
box.lookAt(sphere.position);
scene.add(box);

https://jsfiddle.net/prisoner849/zc9fbexq/

1 Like
3

Related: http://mathworld.wolfram.com/SpherePointPicking.html

4

Thanks, effectively this soluce works. BUT… :blush: in my case i’m searching to create trees with trunc and foliage. The problem is that the trunc is not set relatively to the center of the sphere.
I put a jsfiddle to explain that : (trunc is white and foliage is red)
https://jsfiddle.net/ebhja9wm/

When i change the rotation of the mesh, that don’t works because in certain area the degree is not correct.

5

Are you looking for something like that?
https://jsfiddle.net/prisoner849/twuLpb56/

2 Likes
6

Yes exactly ! thanks.

7

Again me…Sorry.

in fact i’m searching to move my tree in same time than my heart(sphere).
https://jsfiddle.net/espace3d/67o8y1ct/
and it doesn’t works because my tree rotate around his center and not the center of the hearth.
i see that a pivot point can do that or a group. But my attempts don’t works…thanks if you could show me the solution.

8

Set your “trees” as children of the sphere then.
https://jsfiddle.net/prisoner849/1bar6eg5/

2 Likes
9

Thanks a lot i will remember in the future of using group . Have a good day.

10

hi,

Now i would create collision between my trees and a static cube. When the static cube hit a tree, the sphere must stop… i success at half…

Sometimes, when i launch my jsfiddle, it’s like the scene restart infinitely. Normally the sphere must only stop.
Could you try this 3 or 4x ?

https://jsfiddle.net/p83426y9/

11

Here is the update fiddle: https://jsfiddle.net/p83426y9/1/

  • You have set sphere.rotation.z to zero which was responsible for the restart. I’ve fixed this by resetting the previous rotation.
  • I’ve noticed that you create unnecessarily many objects in your collide() function via Object3D.clone(). It’s more memory friendly to define helper objects just once outside of the function and reuse them.
  • In one of your statements you have used directionVector.length(). This code does not make sense since directionVector is already normalized so length() returns always 1. I’ve rewritten the code a bit so you are using the real length of the vector defined by the difference between a vertex and the box’s position.
12

Hi and thanks for your jsfiddle!
I’m a little bit loss with this.
I took your snippet and in the same time the doc to understand but i 'm still again loss :frowning :frowning:
could you explain to me in more detail each line, i’m starting with 3d…before i works with Phaser, only 2d…

  for (var vertexIndex = 0; vertexIndex < staticCube.geometry.vertices.length; 
             vertexIndex++)
         {
        var vertices = staticCube.geometry.vertices;
	vertex.copy( vertices[ vertexIndex ] );
	
	vertex.applyMatrix4( staticCube.matrixWorld );
	const length = direction.subVectors( vertex, originPoint ).length();
	direction.divideScalar( length );
13

The following line transforms a vertex of the geometry from its local space to world space. That’s necessary since your ray is defined in world space. However, you can also do it the other way around. Transform the ray into the local space of the mesh which is in most cases more performant for raycasting (since you transform the ray just once for all vertices of the geometry).

vertex.applyMatrix4( staticCube.matrixWorld );

The following lines calculates the direction vector via vector subtraction. This vectors needs to be normalized. You can do it via direction.normalize() but since you need the length of the vector a bit later in your code, it is calculated and then used for normalization. Normalizing a vector is nothing else than dividing it through its length.

const length = direction.subVectors( vertex, originPoint ).length();
direction.divideScalar( length );
1 Like