Basic plane

20 views
Skip to first unread message

Drew

unread,
Aug 30, 2011, 1:41:02 AM8/30/11
to PhiloGL
I'm trying to get a basic plane going based on the examples:
https://gist.github.com/1180228

I imagine I need different shaders but not sure what to use in place
of these. The docs didn't specify how to add points to a plane.
Think of an integral over small values of n of an equation. Use a
plane to describe the area covered by the integral. Any examples
available for building a simple graph like this?

Nicolas Garcia Belmonte

unread,
Aug 30, 2011, 1:45:56 AM8/30/11
to phi...@googlegroups.com
Use this as base:

http://senchalabs.github.com/philogl/PhiloGL/examples/lessons/11/

You don't need to write any shaders, the default ones are used:

http://senchalabs.github.com/philogl/doc/shaders.html

Then change the Sphere to be a Plane:

http://senchalabs.github.com/philogl/doc/o3d.html#O3D:Plane

Remove all events and textures if you won't be using them, and you're done.

--
Nicolas Garcia Belmonte - http://philogb.github.com/

Drew

unread,
Aug 30, 2011, 1:55:31 AM8/30/11
to PhiloGL
It's going now, how do I add boundaries to my plane... vertices array?

On Aug 30, 1:45 am, Nicolas Garcia Belmonte <phil...@gmail.com> wrote:
> Use this as base:
>
> http://senchalabs.github.com/philogl/PhiloGL/examples/lessons/11/
>
> You don't need to write any shaders, the default ones are used:
>
> http://senchalabs.github.com/philogl/doc/shaders.html
>
> Then change the Sphere to be a Plane:
>
> http://senchalabs.github.com/philogl/doc/o3d.html#O3D:Plane
>
> Remove all events and textures if you won't be using them, and you're done.
>

Drew

unread,
Aug 31, 2011, 10:03:07 AM8/31/11
to PhiloGL
So it would probably help to show a picture, I have a series of (x,y)
points I have converted to a matrix ( z== 0 ). I want to now fill in
the space underneath these points. O3D is creating triangles based on
the points, but now I need to fill in triangles down to the y axis ( y
== 0 ) or have a better way of doing this sort of object.

http://gyazo.com/2e31f5686bf8e7a770c41bce854c1b9d

Nicolas Garcia Belmonte

unread,
Aug 31, 2011, 11:22:42 AM8/31/11
to phi...@googlegroups.com

You need to create a proper triangle tessellation that fill the area underneath to be able to have what you're looking for. One way to do this would be to have, each two sampled points also two points with the same x value but with y 0 so that you cam create a plain out of joining two triangles with those four vertices. And then repeat he procedure for all other vertices. Foe this you will also have to use an indices array to tell webgl in what order it has to take the vertices in the array to create tie triangles. You can read about all this by googling "modern introduction to OpenGL" and then reading the first chapter.

Drew

unread,
Aug 31, 2011, 2:54:58 PM8/31/11
to PhiloGL
Thanks for the tip about modern GL, I've been trying to find the right
OpenGL Tutorial without getting lost in the numerous theory posts.
Also good point on sampling two points, I was zeroing the first and
last point and creating a triangle out of every point and those two
contrived points. I suppose I thought this was a bad solution to a
common problem, but its working pretty well for me and yours should
fix problems with large deltaY.

On Aug 31, 11:22 am, Nicolas Garcia Belmonte <phil...@gmail.com>
wrote:
> You need to create a proper triangle tessellation that fill the area
> underneath to be able to have what you're looking for. One way to do this
> would be to have, each two sampled points also two points with the same x
> value but with y 0 so that you cam create a plain out of joining two
> triangles with those four vertices. And then repeat he procedure for all
> other vertices. Foe this you will also have to use an indices array to tell
> webgl in what order it has to take the vertices in the array to create tie
> triangles. You can read about all this by googling "modern introduction to
> OpenGL" and then reading the first chapter.

Nicolas Garcia Belmonte

unread,
Aug 31, 2011, 3:00:25 PM8/31/11
to phi...@googlegroups.com
Yeah,

Another way (maybe more performant way) would be to somehow send the
function definition over to the fragment shader and sample the points
from the fragment shader values so for each x, and y interpolated in
the fragment shader you could assign a pixel color.

This might help: https://github.com/deanm/graphycalculator.

--

Reply all
Reply to author
Forward
0 new messages