import peasy.*;
Planet sun;

PeasyCam cam;

void setup() {
  size(600, 600, P3D);
  cam = new PeasyCam(this, 500);
  sun = new Planet(50, 0, 0);
  sun.spawnMoons(4, 1);
}

void draw() {
  background(0);
  lights();
  sun.show();
  sun.orbit();
}

// planet class

class Planet {
      float radius;
      float distance;
      Planet[] planets;
      float angle;
      float orbitspeed;
      PVector v;

      PShape globe;

      Planet(float r, float d, float o) {

    v = PVector.random3D();

    radius = r;
    distance = d;
    v.mult(distance);
    angle = random(TWO_PI);
    orbitspeed = o;
  }

  void orbit() {
    angle = angle + orbitspeed;
    if (planets != null) {
      for (int i = 0; i < planets.length; i++) {
        planets[i].orbit();
      }
    }
  }

  void spawnMoons(int total, int level) {
    planets = new Planet[total];
    for (int i = 0; i < planets.length; i++) {
      float r = radius/(level*2);
      float d = random((radius + r), (radius+r)*2);
      float o = random(-0.1, 0.1);
      planets[i] = new Planet(r, d, o);
      if (level < 2) {
        int num = int(random(0, 3));
        planets[i].spawnMoons(num, level+1);
      }
    }
  }

  void show() {
    pushMatrix();
    noStroke();
    PVector v2 = new PVector(1, 0, 1);
    PVector p = v.cross(v2);
    rotate(angle, p.x, p.y, p.z);
    stroke(255);
    //line(0, 0, 0, v.x, v.y, v.z);
    //line(0, 0, 0, p.x, p.y, p.z);

    translate(v.x, v.y, v.z);
    noStroke();
    fill(255);
    sphere(radius);
    //ellipse(0, 0, radius*2, radius*2);
    if (planets != null) {
      for (int i = 0; i < planets.length; i++) {
        planets[i].show();
      }
    }
    popMatrix();
  }
}

And this is the p5.js code

var easycam;

function setup() {
    createCanvas(windowWidth,windowHeight,WEBGL);
    easycam = createEasyCam();
    sun = new Planet(20, 0, 0, random(TWO_PI));
    sun.spawnMoons(2, 1);
}

function draw() {
    background(0);
    cursor(HAND);

    sun.show();
    sun.orbit();
}

//planet class

        class Planet {
            constructor(radius, distance, orbitspeed, angle,mass) {
            this.radius = radius;
            this.distance = distance;
            this.orbitspeed = orbitspeed;
            this.angle = angle;
            this.planets = [];
            this.mass=mass;

            // this should be correct
            // this is the vector coming out of the planet itself.

            this.v = createVector();
            this.v = p5.Vector.random3D();
            this.v. mult(this.distance);
            // park this for now.
            // this.v = createVector();
            // this.v = p5.Vector.random3D();
            // this.v.mult(this.distance);
            // var v = new p5.Vector.random3D();
            // v. mult(this.distance);


        }


    orbit() {
        this.angle += this.orbitspeed/this.mass;
        for (let i in this.planets) {
            this.planets[i].orbit();
        }
    }


    spawnMoons(total, level) {
        for (let i = 0; i < total; i++) {
            let r = this.radius/(level*2);
            let d = random(50, 150);
            let o = random(-0.1, 0.1);
            let a = random(TWO_PI);
            this.planets.push(new Planet(r, d/level, o, a));
            if (level < 1) {
                let num = Math.floor(random(0, 4));
                this.planets[i].spawnMoons(num, level+1);
            }
        }
    }


    show() {
      push();
      noStroke(0)
      // fill(255);
      // let v2 = createVector(1,0,1);
      // let p = createVector(v.cross);
      // this.v2 = createVector(0, 0, 1);
      // this. p = this.v.cross(this.v2);
      // rotateY(this.angel);
      // translate(v.x,v.y,v.z);
      this.v2= createVector(1,0,1);
      this.p= this.v.cross(this.v2);
      rotate(this.angel,this.p.x,this.p.y,this.p.z);
      translate(this.v.x,this.v.y,this.v.z);
      //lights
          ambientLight(5,100);
          directionalLight(255, 255, 255, 0.2, 0.2, 0.7);
          specularMaterial(255);
          sphere(this.radius);

        for (let i in this.planets) {
            this.planets[i].show();
        }
        pop();
    }

}

I would really really appreciate some help, its quite difficult to find references on vectors in p5.js.

Thanks loads in advance

// importing the Peasy Cam library
import peasy.*;
import peasy.org.apache.commons.math.*;
import peasy.org.apache.commons.math.geometry.*;

// declaring the main emoji
Planet sun;
//declairing the Peasy Cam 
PeasyCam cam;
// declaring the PImage function
PImage img;
// declairing the the texture
PImage[] textures = new PImage[7];
// declaring the particle system

void setup() {

  size(displayWidth, displayHeight, P3D);


  img = loadImage("1.jpg");
  textures[0]= loadImage("2.jpg");
  textures[1]= loadImage("3.jpg");
  textures[2]= loadImage("4.jpg");
  textures[3]= loadImage("5.jpg");
  textures[4]= loadImage("6.jpg");
  textures[5]= loadImage("7.jpg");
  cam = new PeasyCam(this, 500);
  sun = new Planet (100, 0, 0, img);
  sun.spawnMoons(10, 4);
}

void draw() {

  background(0);
  lights();
  ambientLight(129, 62, 0);
  //translate(displayWidth, displayHeight);
  noFill();
  stroke(255);
  strokeWeight(1);
  //rotateY(frameCount/200.0);
  box(4000);

  lights();
  ambientLight(129, 62, 0);
  directionalLight(51, 102, 126, 0, -1, 0);
  spotLight(255, 0, 0, width/2, height/2, 400, 0, 0, -1, PI/4, 2);

  sun.show();
  sun.orbit();
}

class Planet {
  float radius;
  float angle;
  float distance;
  Planet [] planets;
  float orbitSpeed;
  PVector v;
  PShape globe;
  float mass=1;


  Planet(float r, float d, float o, PImage img ) {
    v = PVector. random3D();
    radius = r;
    angle = random(20);
    distance= d;
    v.mult(distance);
    orbitSpeed = o;

    noStroke();
    noFill();
    globe = createShape(SPHERE, radius);
    globe.setTexture(img);
  }
  void spawnMoons(int total, int level) {
    planets = new Planet[total];
    for (int  i = 0; i<planets.length; i++) {

      float r= random(level*10);

      float d = random(100, 1000);

      float o = random (-0.01, 0.02);

      int index = int(random (textures.length));
      planets[i]= new Planet (r, d, o, textures[index]);

      if (level<1) {
        int num = int(random(0, 5));
        planets[i].spawnMoons(num, level+1);
      }
    }
  }

  void orbit() {
    angle =  angle + orbitSpeed/mass;
    if (planets !=null) {
      for (int  i = 0; i<planets.length; i++) {
        planets[i].orbit();
      }
    }
  }
  void show() {
    pushMatrix();
    noStroke();
    PVector v2 = new PVector(1, 0, 1);
    PVector p = v.cross(v2);
    rotate (angle, p.x, p.y, p.z);

    translate(v.x, v.y, v.z);
    shape(globe);
    if (planets !=null) {
      for (int  i = 0; i<planets.length; i++) {
        planets[i].show();
      }
    }
    popMatrix();
  }
  void bounce() {
  }
}

I would really appreciate your help Thanks

What I want to do is to get the data from the 3D skeleton and tell what object the user is pointing to.

Like point at the lamp and the lamp turns on.

Point at the PC a video starts playing.

Controlling the objects is easy but I'm having a lot of trouble conceptualizing the 3D picking.

How do I detect what the 3D skeleton is pointing at? I can imagine I should cast a ray out of their hand down the finger and check the intersection with collision detection spheres but I have no clue how to implement that. I've tried with some vectors but I just can't check collisions with them. I've read some of the 3D picking threads but they all talk about picking objects with the mouse.

Can anyone help me with this? I'm using the latest processing 3.3.5.

I find a story about the cross product but I don't find the other vector to put in cross(Vec 1, vec2) :(

PVector dir, tan ;
void setup() {
  size(400,400,P3D) ;

  dir = new PVector(random(-1,1),random(-1,1),random(-1,1)) ;

  tan = new PVector() ;
  tan = dir.cross(new PVector(-dir.y, dir.x,0)) ;
}


void draw() {
  background(0) ;
  noFill() ;
  stroke(255) ;
  strokeWeight(1) ;
  int radius = 50 ;
  PVector final_pos = new PVector(width/2,height/2, 0) ;

  PVector pos_projection = new PVector() ;
  PVector dir_temp = dir.copy() ;
  pos_projection = dir_temp.mult(radius).add(final_pos).copy() ;

  PVector pos_tan = new PVector() ;
  PVector tan_temp = tan.copy() ;
  pos_tan = tan_temp.mult(radius/2).add(final_pos).copy() ;

  //display projection
  line(final_pos.x,      final_pos.y,       final_pos.z,
       pos_projection.x, pos_projection.y,  pos_projection.z ) ;
  // display tangent   
  line(pos_projection.x, pos_projection.y,  pos_projection.z,
        pos_tan.x, pos_tan.y,  pos_tan.z ) ;

  println(final_pos.x,      final_pos.y,       final_pos.z,
       pos_projection.x, pos_projection.y,  pos_projection.z ) ;

  println(pos_projection.x, pos_projection.y,  pos_projection.z,
        pos_tan.x, pos_tan.y,  pos_tan.z ) ;

}