Click on a point on a sphere

p5.js Coding Questions
1

Hi i’m trying to make a kind of “world” navigation where i have points distributed on a sphere that can be rotated, i’m having trouble to find the way to click on an specific point on the sphere surface, so far i’ve managed to distribute different points over the sphere but i can’t make them clickable. Thank you for your help.

Here is the link to my p5 sketch.
https://editor.p5js.org/voidgar/sketches/4GTKRffq

1 Like
2

You can draw the same stuff in an offscreen buffer and use different, unique colors for the markers

Now when mouse is clicked, get the color underneath the mouse with color c1 = pg.get(mouseX,mouseY); compare c1 to the colors of your markers

2 Likes
3

Pretty clever work around! Thank you, it was what i was looking for, i thought on doing it with color but didn’t went too far. I will try to implement it! Thanks :grinning: :sparkles:

1 Like
4

Off screen buffer would be PGraphics pg;
must be the same size as your sketch; advantage of using an offscreen buffer is that here you can have different unique colors. In the real screen you can use the same color for the markers and also use lights(); which makes the scene look better in 3D.

Then color c1=pg.get(mouseX, mouseY);

5

Hello,

This may be helpful:

There is a 3D example in the GitHub repositiory.

:)

2 Likes
6

Picking is a great technique, and quite simple to implement by hand. For a javascript implementation, see mPicker:

2 Likes