3D canvas clipping/Rotated Y lines not making it to or beyond the edge of z -axis?

Long time lurker, first time poster. I am working on a generative sketch with WEBGL

This is an example.

I’m having a huge issue getting my grid lines to extend to the edge of the canvas. And I suspect it’s because i either dont fully understand the 3D space entirely or there is some kind of clipping going on. I’ve tried to use the camera function to step forward on the zplane a few steps to make up the extra space but feel like i should also be able to just extend the lines.

The grid itself is fairly standard nested loops with x axis and y-axis lines that i then rotated 89 degrees. What’s interesting is at 88 degrees the lines make it all the way to the edge of teh screen but any more increasing the rotation gives me the above effect which i’m trying to avoid. Adding any amount of additinal y axis doesn’t change the length of the vertical lines. It’s like there is a padding or something.

Happy to share code or a link but suspect this may just be me needing to better understand the plane or camera functions (which i’ve played with mainly unsuccessfully thus far)

hi! welcome to the forum!

nice project! I think what is happening is indeed clipping - in 3d rendering there is a parameter for “clipping plane” to ignore what is behind the camera or too far away. In p5.js you can set it with perspective

https://p5js.org/reference/#/p5/perspective

if you set near close to zero (since it might not work with 0) you will see polygons and lines close to the camera.

2 Likes