# WEBGL get the specific lineVertexes of a shape

**URL:** <https://discourse.processing.org/t/webgl-get-the-specific-linevertexes-of-a-shape/24399>\
**Category:** Development\
**Created:** [October 7, 2020, 1:23am UTC](https://discourse.processing.org/t/webgl-get-the-specific-linevertexes-of-a-shape/24399 "2020-10-07T01:23:27Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![SamuelCobb](https://avatars.discourse-cdn.com/v4/letter/s/73ab20/32.png) [@SamuelCobb](https://discourse.processing.org/u/SamuelCobb)\
**Post date:** [October 7, 2020, 1:23am UTC](https://discourse.processing.org/t/webgl-get-the-specific-linevertexes-of-a-shape/24399/1 "2020-10-07T01:23:27Z")

</div>

I am trying to make a ray-triangle intersection for a library that I am working on.

My problem is not the actual ray-intersection algorithm, since I already have that ready. My issue is that I cannot access the individual vertices/lineVertices of each shape, which I need for the algorithm.

```auto
function setup () {
  createCanvas(500, 500, WEBGL);
}

function draw() {
  background(220);
  push();
  translate(0,100,0)
  box();
  
  for(let i = 0; i < 3; i++){   
    push();
    points = this._renderer.retainedMode.geometry['box|4|4'].model.vertices[(i+pointCounter)%this._renderer.retainedMode.geometry['box|4|4'].model.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(){
  console.log(this._renderer.retainedMode.geometry['box|4|4'])
}

```

This is just some sample code that I have to show y’all what I have so far.

Is there an easier way to access the faces, like accessing one of the webGL buffers (which I don’t know how to do) or am I looking in the wrong places?

Help would really be appreciated!

-Sam

---

<div class="post-metadata">

**Author:** ![SamuelCobb](https://avatars.discourse-cdn.com/v4/letter/s/73ab20/32.png) [@SamuelCobb](https://discourse.processing.org/u/SamuelCobb)\
**Post date:** [October 8, 2020, 12:11am UTC](https://discourse.processing.org/t/webgl-get-the-specific-linevertexes-of-a-shape/24399/2 "2020-10-08T00:11:07Z")

</div>

For those who saw this, I just figured out how the data structure works.

here is some sample code to show you what I did: [https://editor.p5js.org/sjcobb/sketches/zNC6HOGll](https://editor.p5js.org/sjcobb/sketches/zNC6HOGll)

here’s the juice of the code for those of you who don’t want to look at the editor:

```auto
  let indexes = [];
  let points = [];
  faces = this._renderer.retainedMode.geometry['box|4|4'].model.faces;
  faces = faces[pointCounter%faces.length];
  pointCounter++
  vertices = this._renderer.retainedMode.geometry['box|4|4'].model.vertices
  
  for(let i = 0; i < 3; i++){
    //3x because all shapes are rendered as triangles by default
    //that is why there are 12 faces instead of 6. in a box.
    points.push(vertices[faces[i]]);
  }
  
  for(let i=0; i<points.length; i++){
    a = [points[i].x, points[i].y, points[i].z]
    //scale(out, inVector, scalar)
    vec3.scale(a, a, 50);
    point(a[0], a[1], a[2]);
  }
  pop();

```

As you can see, it is a much more complicated method than it should be.

This is still not the end of my search though, I still need to fine a way to find the specific geometry for each specific shape, (maybe I can make a prototype of the shape functions eg. box.geometry() which returns the geometry of that individual box)

All feedback would be really helpful