Hey guys,
I'm trying to make a ray-triangle intersection algorithm in p5.js but I have been having some issues relating to locating where and how the vertex/face data is stored for each object. I don't know the specific details related to how vertex and face data in webGL but it would be really useful if they had a data structure similar to this:
shape[face, face, [vertex,vertex,[x,y,z]]]
what I HAVE found is that p5 does have a system for storing all these values but I am not sure what structure they have as they are all separate arrays.
for example a test sketch in p5 may look something like this
let pointCounter = 0;
function setup () {
createCanvas(500, 500, WEBGL);
}
function draw() {
background(220);
push();
translate(0,100,0)
box();
pop();
for(let i = 0; i < 3; i++){
push();
vertices = this._renderer.retainedMode.geometry['box|4|4'].model.vertices
points = vertices[(i+pointCounter)%vertices.length];
points = [points.x, points.y, points.z];
//console.log(points) vec3.scale(points, points, 50);
//translate(0,200,0);
point(points[0],points[1],points[2]);
pointCounter++
pop();
}
function keyPressed(){
//for my own reference
console.log(this._renderer.retainedMode.geometry['box|4|4'])
}
to get this to work you would need to run it on https://editor.p5js.org/
As you can see from this code, there IS data relating to the shapes, but it is not a the for a specific object but for the entire geometry. Although I could make a function to give each specific shape it's own geometry attribute, I think there MUST be a better way to find the data relating to each shape, whether it be through WEBGL buffers (which I have no idea how to access) or through some other method. Does anyone know a way to do this?
thanks
- Sam