Contact: zeng  @  zegraph.com      Last update: 20 January 2010

ZeGraph Examples

Example-1 (for general functions)

load("zegraph.dll");

render=zegraph("render");       // create one object

// create several objects by one call
[scene, dot] = zegraph("scene", "point");

// add scene to render
render.add(scene);
// ponit to scene
scene.add(dot);
// set point size
dot.size(5);
// add data to vertex
dot.add(0,0,0, 100, 100, 0);

// render scene to window
render.show();

// disable point
disable(dot);
render.show();

// disable point
enable(dot);
render.show();

Example-2 (for render)

load("zegraph.dll");

// create several objects by one call
[render,scene,shape]=zegraph("render","scene", "polygon");

// get render size
[w,h]=render.size();
csv(w,h);

// reset render size
render.size(300, 300);
[w,h]=render.size();
csv(w,h);

// add data to shape's vertex
shape.add(-50,-50,0, 50,-50,0, 0,50,0);
// set shape type
shape.type("triangles");
// set shape color to red
shape.color(1,0,0);

// add shape to scene
node=scene.add(shape);

// add scene. it's viewport will be set to (0,0,w,h).
render.add(scene);

// let's show the scene
render.show();

// change background color to black;
render.color(0,0,0);
render.show();

// let's save image
render.tofile("test.png");

// and make gif animation
for (i=1; i<=36; i++)
{
    node.rotatez(i*10);
    if (i==1) {
        render.togifa("test.gif");
    }
    else {
        if (i==36)
            render.togifa("end");
        else
            render.togifa("add");
    }
}

// clear scene and see what will happen
render.clear();
render.show();

Example-3 (for scene)

load("zegraph.dll");

// create several objects by one call
[render,scene,light,shape]=zegraph("render","scene","light","polygon");

// add light to scene and shape to light
node=scene.add(light);
light.add(shape);

// add scene.
render.add(scene);

// make a box
shape.box(50);

// let's show the scene
render.show();

// it's black because that the default foreground color
// let change the color to green through scene
scene.color(0,1,0);

// you can rotate the node by using it in show function
render.show(node);

// let's see the box in perspective view
scene.perspective(true);
render.show(node);

// add the second scene

[scene2,light2,shape2]=zegraph("scene","light","polygon");
render.add(scene2);
scene2.add(light2);
light2.add(shape2);

// create sphere vertex data for shape2 and make it having it's own color 
shape2.sphere(50);
shape2.color(0,0,1);

render.show(node);

// it does not work out well because the two scene overlap
// let's change their view port

[w,h]=render.size();

scene.viewport(0,h/2,w,h/2);
scene2.viewport(0,0,w,h/2);

render.show(node);

Example-4 (for node)

load("zegraph.dll");

// concreate several objects by one call
[render,scene,shape]=zegraph("render","scene","point");

// setup scene
render.add(scene);

// add data to point's vertex
shape.add(0,0,0);
shape.size(10);

// the followings arrange point in scene.
// it show node's usage, not a good way to plot points

// create nodes
[n1,n2,n3,n4,n5]=zegraph("node","node","node","node","node");

// add them to the scene and get its root node
node=scene.add(n1,n2,n3,n4,n5);
// check how many objects in it
csv(node.size());

// add shape to nodes
n1.add(shape);
n2.add(shape);
n3.add(shape);
n4.add(shape);
n5.add(shape);

// if no color has been set to the shape,
// it inherits color of node.
n3.color(1,0,0);

// arrange point through node
n1.translate(-100,0,0);
n2.translate(-50,0,0);
n4.translate(50,0,0);
n5.translate(100,0,0);

render.show();

// move every objects in roo node
node.translate(0,100,0);

render.show();

// reset root node transformation
node.reset();
// rotate every object in roo node
node.rotatez(45);
// shrink every object
node.scale(.5,.5,.5);

render.show();

// remove a object
node.remove(n3);

render.show();

// remove all objects
node.clear();

render.show();

Example-5 (for point)

load("zegraph.dll");

[render,scene,shape]=zegraph("render","scene","point");

// setup scene
render.add(scene);

// add shape to scene
scene.add(shape);

// add data to point's vertex
shape.add(-100,0,0,     // x-y-z of the first vertex
          -50,0,0,      // x-y-z of the second vertex
           0,0,0,       // x-y-z of the third vertex
           50,0,0,      // x-y-z of the fourth vertex
           100,0,0);    // x-y-z of the fifth vertex

shape.size(10);

// show the scene
render.show();

// change the color of all vertexes
shape.color(0,0,1);

render.show();

// you can also give each vertex a different color
rgba=zegraph("color");
rgba.add(1,0,0,1,       // red-green-blue-alpha of the first vertex
         0,1,0,1,       // red-green-blue-alpha of the second vertex
         0,0,1,1,       // red-green-blue-alpha of the third vertex
         1,0,0,1,       // red-green-blue-alpha of the fourth vertex
         1,0,1,1);      // red-green-blue-alpha of the fifth vertex
shape.color(rgba);

render.show();

// like node, you can move, rotate, and scale point 

shape.rotatez(45);

render.show();

Example-6 (for line)

load("zegraph.dll");

[render,scene,shape]=zegraph("render","scene","line");

// setup scene
render.add(scene);

// add shape to scene
scene.add(shape);

// add vertex data

for (i=0; i<=30; i++) {
    x=10*(i-15);
    y=50*cos(i*pi()/15);
    shape.add(x,y,0);
}

// show the scene
render.show();

// the default line type "strip" connects vertices from one to another
// the "loop" type also connects the last vertex with the first
shape.color(0,0,1);
shape.type("loop");

render.show();

// the "lines" type connects every other two vertices
shape.type("lines");

render.show();

// by coincident, the line looks like dash
// we can change line style explicitly
shape.type("strip");
shape.dash(2);

render.show();

// make like smooth
shape.solid(2);
shape.smooth(true);

render.show();

// apply gradient colors to line
rgba=zegraph("color");
shape.color(rgba);
for (i=0; i<=30; i++) {
    r=i/30.0;
    b=(30-i)/30.0;
    rgba.add(r,0,b,1);
}

render.show();

// generate line vertex data by special function
shape.circle(100);
render.show();

shape.vector(100,30,10);
render.show();

// make contour

load("matrix.dll");     // load matrix library

Z=double(5,5);          // create 5x5 double matrix
Z.rand();               // fill with random numbers of 0 to 1
[zptr,n]=Z.ptr();       // get pointer to Z

X=double(5);            // matrix for x-axis data
X.fill(0,30);
[xptr,nx]=X.ptr();

Y=double(5);            // matrix for y-axis data
Y.fill(0,30);
[yptr,ny]=Y.ptr();

// contour
shape.contour(zptr,xptr,nx,yptr,ny,0.5);

render.show();

Example-7 (for polygon, texture, material, and light)

load("zegraph.dll","matrix.dll");

[render,scene,light,shape]=zegraph("render","scene","light","polygon");

// setup scene
render.add(scene);

// make shape from scratch and apply texture to it

[tex,xyz,st]=zegraph("texture","vertex","texcoord");

shape.vertex(xyz);      // set vertex to shape
shape.texcoord(st);     // set texture coordinate to shape
shape.texture(tex);     // set texture to shape;
shape.type("quads");    // set shape type

// add vertex coordinate
xyz.add(-100,-100,0, 100,-100,0, 100,100,0, -100,100,0);
// import image
[s,t]=tex.image("data/earth.png");
// add texture coordinate
st.add(0,0, s,0, s,t, 0,t);

// and add to scene
root=scene.add(shape);

render.show();

// remove the shape
root.clear();

// remake the shape
shape=zegraph("polygon");

// light is need to show shading or depth of polygon in 3D space
root=scene.add(light);

// add shape to light;
light.add(shape);

// let make a torus
torus=shape.torus(100,20);
shape.color(0,1,1);

render.show(root);

// apply materia
m=zegraph("material");
m.ambient(0.2125,0.1275,0.054);
m.diffuse(0.714,0.4284,0.18144);
m.specular(0.393548,0.271906,0.166721);
m.emission(0,0,0);
m.shininess(25.6);

shape.color(1,1,1);     // shape color should be white
shape.material(m);

render.show(root);

// make parameterized surface
shape.uvsurface("kuen",-4.5,4.5,1.e-5,pi()-1.e-5,20);
render.show(root);

// make implicit surface
shape.implicit("sphere",-1,1,-1,1,-1,1,20);
shape.scale(100,100,100);
render.show(root);

// make iso-surface
iso_sphere(shape);
shape.scale(100,100,100);
render.show(root);

////////////////////////////////////////////////////////

function kuen(s,t)
{
    a=1.0+s*s*sin(t)*sin(t);
    x=2.0*(cos(s)+s*sin(s))*sin(t)/a;
    y=2.0*(sin(s)-s*cos(s))*sin(t)/a;
    z=log(tan(t/2.0))+2*cos(t)/a;
    return [50*x, 50.0*y, 20.0*z];
}

function sphere(x,y,z)
{
    r = sqrt(x*x+y*y+z*z)-0.9;
    return r;
}


function iso_sphere(poly)
{
    X=double(21);
    X.fill(-1,0.1);
    [px,nx]=X.ptr();

    Y=double(21);
    Y.fill(-1,0.1);
    [py,ny]=Y.ptr();

    Z=double(21);
    Z.fill(-1,0.1);
    [pz,nz]=Z.ptr();

    W=double(nx*ny*nz);
    [pw,nw]=W.ptr();

    for (iz=0; iz<nz; iz++) {
        nxyz=iz*nx*ny;
        z=Z[iz];
        for (iy=0; iy<ny; iy++) {
            nxy=iy*nx;
            y=Y[iy];
            for (ix=0; ix<nx; ix++) {
                x=X[ix];
                W[nxyz+nxy+ix]=sqrt(x*x+y*y+z*z);
            }
        }
    }

    poly.isosurface(pw,px,nx,py,ny,pz,nz,0.9);
}

Example-8 (for globe)

load("zegraph.dll","matrix.dll");

[render,scene,light,globe]=zegraph("render","scene","light","globe");

// setup scene
render.add(scene);

// light is need to show shading or depth of polygon in 3D space
root=scene.add(light);

// add globe to light;
light.add(globe);

globe.focus(0,45);

// use image for globe surface
globe.texture(150,"data/earth.png");

render.show(globe);

// make globe surface
globe.surface(150);
// make lon-lat grid lines
obj=globe.grid(20);
obj.color(1,1,1);

render.show(globe);

obj=globe.gshhs("data/gshhs_c.b");
obj.color(1,1,1);

render.show(globe);

// put a small ball on globe surface
shape=zegraph("polygon");
shape.sphere(5);
shape.color(1,1,0);
globe.add(shape,0,0);
// use the ball more than once
globe.add(shape,45,45);

render.show(globe);

// draw a line on globe surface
obj=globe.line(0,0,45,45);
obj.color(1,1,0);
obj.solid(2);

render.show(globe);

Example-9 (for text and font)

load("zegraph.dll","matrix.dll");

[render,scene,text]=zegraph("render","scene","text");

// setup scene
render.add(scene);

// add text to scene;
scene.add(text);

// set font size
text.font(16);

// show a text string
text.string("Symbol, superscript, and subscript: alpha123456");

render.show();

// rotate text

text.rotatez(45);
render.show();

// share font and use Japanese
// note: non-Japanese windows will fail

[text2, font]=zegraph("text","font");

font.truetype("C:/windows/fonts/msmincho.ttc");

text.font(font,28);
text.string("日本語");

text2.font(font,24);
text2.string("日本語");
[w,h]=text2.size();
csv(w,h);
text2.translate(0,-3*h,0);

scene.add(text2);

render.show();

Example-10 (for csg)

load("zegraph.dll","matrix.dll");

[render,scene,light,csg,shape1,shape2]=zegraph("render","scene","light","csg","polygon","polygon");

// setup scene
render.add(scene);

// light is need to show shading or depth of polygon in 3D space
root=scene.add(light);

root.rotatey(20);

// add shape to light;
light.add(csg);

shape1.color(0,1,0);
shape1.sphere(50);
shape1.translate(-20,0,0);

shape2.color(0,0,1);
shape2.sphere(50);
shape2.translate(20,0,0);

csg.and(shape1,shape2);

render.show(root);

csg.or(shape1,shape2);

render.show(root);

csg.sub(shape1,shape2);

render.show(root);

Example-11 (for plot)

load("zegraph.dll","matrix.dll");

[render,scene,light,plot]=zegraph("render","scene","light","plot");

// setup scene
render.add(scene);

// light is need to show shading or depth of polygon in 3D space
root=scene.add(light);

// this is a long example, so let's use switch control to select execution.

flag=8;         // change this to 1 to 8 to test different cases


switch(flag) {

case 1:                         // arrange axis

    // add plot to scene
    scene.add(plot);

    render.show();

    // you see that by default axises are in page center
    // and axis range from -1 to 1.

    // anchor x-axis at the bottom
    x=plot.xaxis(0,-1,0);
    // change axis range
    x.range(0,7);
    // set tick marks
    x.tickmarks(0,7,1,0);
    // custominze tick labels
    x.ticklabels("M","T","W","T","F","S","S",true);
    // set axis title
    x.title("Week Day");

    // anchor y-axis on the left
    y=plot.yaxis(-1,0,0);
    // set axis title
    y.title("Y2");
    // set tickmarks
    y.tickmarks(-1,1,.2,1);
    // set tick label disits
    y.tickdigits(1);

    render.show();

    // let's add second y-axis. (you can add as many as you want.)
    axis=zegraph("axis");
    axis.type("y",false);
    axis.title("Second Y");
    axis.color(0,0,1);
    // add the object to plot with x-y-z coordinate to
    // anchor it to that position.
    plot.add(axis,7,0,0);

    render.show();

    // z-axis is disabled by default.
    // you can active z-axis for 3D plot.

    // image a 3D cubic,
    // we move x-axis along y to y minimum and along z to z minimum.
    plot.xaxis(0,-1,-1);
    // and move y-axis along x to x minimum and along z to z minimum.
    plot.yaxis(-1,0,-1);
    // and move a-axis along x to x minimum and along y to y maximum.
    z=plot.zaxis(-1,1,0);
    z.title("Z");
    // set z-axis tickmarks to avoid overlap with y-axis tickmarks 
    z.tickmarks(-0.8,1,.2,0);

    // initially, z-axis point toward us.
    // we rotate plot around global z-axis for 30 degree
    // and around -60 degree to have a good view
    plot.rotate(30,-60);
    // scale down plot
    plot.scale(.5,.5,.5);

    disable(axis);

    // put plot in render to show
    // so that you can rotate plot by mouse or key
    render.show(plot);

    break;

case 2:                         // plot line and point

    scene.add(plot);
    plot.xaxis(0,-1,0);
    plot.yaxis(-1,0,0);

    [line,point,vert]=zegraph("line","point","vertex");

    // line and point share the vertex
    line.vertex(vert);
    point.vertex(vert);
    // add vertex data of plot coordinate
    vert.add(-0.8,-0.8,0, 0,0,0, 0.8,0.8,0);
    // use different colors for line and point
    line.color(0,0,1);
    point.color(1,0,0);
    // set size and with
    point.size(10);
    line.solid(2);
    // add them to plot
    plot.add(line);
    plot.add(point);
    
    render.show(plot);
    
    break;

case 3:                         // plot user defined symbol

    scene.add(plot);
    plot.xaxis(0,-1,0);
    plot.yaxis(-1,0,0);

    cross=zegraph("line");

    // add vertex data of global coordinate to form cross sign
    cross.add(-3,-3,0, 3,3,0, -3,3,0, 3,-3,0);
    // set line type to connect every two vertices
    cross.type("lines");
    // set color and line with
    cross.color(1,0,0);
    cross.solid(2);
    // anchor symbole in plot
    plot.add(cross,-0.8,-0.8,0);
    plot.add(cross,0,0,0);
    plot.add(cross,0.8,0.8,0);
    
    render.show();

    break;

case 4:                         // plot user filled bar

    scene.add(plot);
    plot.xaxis(0,-1,0);
    plot.yaxis(-1,0,0);

    bar=zegraph("polygon");

    // add vertex data of plot coordinate
    bar.add(-0.2,-0.99,0, -0.2,0.7,0, 0.2,0.7,0, 0.2,-0.99,0);
    // set bar type to form polygon with every four vertices
    bar.type("quads");
    // set color
    bar.color(0,1,0);
    // fill bar with pattern
    bar.pattern("xxxxoooo");
    // add bar to plot
    plot.add(bar);
    
    render.show();

    // another pattern
    bar.pattern("xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"+
                "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"+
                "oooooooooooooooooooooooooooooooo"+
                "oooooooooooooooooooooooooooooooo");

    render.show();

    break;

case 5:                         // 2D map

    scene.add(plot);
    xmin=80; xmax=160; ymin=10; ymax=60;

    a=plot.xaxis(0,-1,0);
    a.range(xmin,xmax);
    a.tickmarks(xmin,xmax,10,0);
    a.tickdigits(0);

    a=plot.yaxis(-1,0,0);
    a.range(ymin,ymax);
    a.tickmarks(ymin,ymax,10,0);
    a.tickdigits(0);

    // coastlines
    line=zegraph("line");
    line.gshhs("data/gshhs_l.b",xmin,xmax,ymin,ymax);
    line.color(0,0,1);

    plot.add(line);
    
    render.show();

    // filled land
    poly=zegraph("polygon");
    poly.gshhs("data/gshhs_c.b",xmin,xmax,ymin,ymax);
    poly.color(0,0,1);

    plot.clear();
    plot.add(poly);

    render.show();

    break;

case 6:                         // 3D bar on 2D map

    light.add(plot);

    xmin=80; xmax=160; ymin=10; ymax=60; zmin=0; zmax=10;

    a=plot.xaxis(0,-1,-1);
    a.range(xmin,xmax);
    a.tickmarks(xmin,xmax,20,0);

    a=plot.yaxis(-1,0,-1);
    a.range(ymin,ymax);
    a.tickmarks(ymin,ymax,10,0);

    a=plot.zaxis(-1,1,0);
    a.range(zmin,zmax);
    a.tickmarks(zmin+2,zmax,2,0);

    plot.rotate(30,-60);
    plot.scale(.5,.5,.5);

    // coastline
    line=zegraph("line");
    line.gshhs("data/gshhs_l.b",xmin,xmax,ymin,ymax);
    line.color(0,0,1);
    plot.add(line);
    
    // frame
    line=zegraph("line");
    line.add(xmin,ymax,zmin, xmax,ymax,zmin, xmax,ymin,zmin);
    plot.add(line);

    // the bar
    poly=zegraph("polygon");
    // calculate bar height
    [x1,y1,z1]=plot.global(xmin,ymin,zmin);
    [x2,y2,z2]=plot.global(xmin,ymin,zmax);
    // make bar
    poly.cylinder((z2-z1),10);
    poly.color(1,0,0);
    // anchor bar at map center
    plot.add(poly,.5*(xmin+xmax),.5*(ymin+ymax),zmin);

    render.show(plot);

    break;

case 7:                         // 2D contour

    scene.add(plot);

    cbar=color_bar();
    scene.add(cbar);

    [X,Y,Z]=contour_data(plot);
    [zp,nz]=Z.ptr();
    [xp,nx]=X.ptr();
    [yp,ny]=Y.ptr();

    for(iso=0.2; iso<=0.8; iso+=0.2) {
        line=zegraph("line");
        vert=line.contour(zp,xp,nx,yp,ny,iso);
        if (vert.size()>0) {
            [r,g,b]=cbar.get(iso);
            line.color(r,g,b);
            plot.add(line);
            text=zegraph("text");
            text.string(format("%.1f",iso));
            text.color(0,0,1);
            plot.clabel(line,text,3);
        }
    }

    render.show(plot);

    break;

case 8:                         // 3D contour

    scene.add(plot);
    plot.add(light);

    // light beam from z-top
    light.position(-1,-1,1);

    cbar=color_bar();
    scene.add(cbar);

    [X,Y,Z]=contour_data(plot,true);
    [zp,nz]=Z.ptr();
    [xp,nx]=X.ptr();
    [yp,ny]=Y.ptr();

    surf=zegraph("polygon");
    xyz=surf.mesh(zp,xp,nx,yp,ny);
    nor=xyz.normal(4);
    surf.normal(nor);
    surf.color(.5,.5,.5);
    // light up the surface
    light.add(surf);
    
    plot.rotate(30,-60);

    for(iso=0.2; iso<=0.8; iso+=0.2) {
        line=zegraph("line");
        vert=line.contour(zp,xp,nx,yp,ny,iso);
        if (vert.size()>0) {
            [r,g,b]=cbar.get(iso);
            line.color(r,g,b);
            line.solid(1.5);
            line.smooth(false);
            // apply z-offset to make the line look better
            line.translate(0,0,0.03);
            plot.add(line);
        }
    }

    render.show(plot);

    surf.fill(1);

    render.show(plot);

    break;

default:
    
    // do nothing
}

function contour_data(plot,flag=false)
{

    nx=30; ny=20;

    // double matrix of ny by nx 
    Z=double(ny,nx);
    // x coordinate
    X=double(nx);
    X.fill(0,2.0*pi()/(nx-1));

    // y coordinate
    Y=double(ny);
    Y.fill(0,2.0*pi()/(ny-1));
    // construct surface
    for (i=0; i<ny; i++) {
        for (j=0; j<nx; j++) {
            Z[i,j]=sin(X[j])*cos(Y[i]);
        }
    }

    // set axises
    xmin=X.min(); xmax=X.max(); dx=(xmax-xmin)/5;
    ymin=Y.min(); ymax=Y.max(); dy=(ymax-ymin)/5;

    if (flag) {
        plot.scale(.5,.5,.5);
        za=plot.zaxis(-1,1,0);
        za.range(-1,1);
        za.tickmarks(-0.5,1,0.5,0);
        za.tickdigits(1);
        xa=plot.xaxis(0,-1,-1);
        ya=plot.yaxis(-1,0,-1);
    }
    else {
        xa=plot.xaxis(0,-1,0);
        ya=plot.yaxis(-1,0,0);
    }

    xa.range(xmin,xmax);
    xa.tickmarks(xmin,xmax,dx,0);
    xa.tickdigits(2);
    ya.range(ymin,ymax);
    ya.tickmarks(ymin,ymax,dy,0);
    ya.tickdigits(2);

    return [X,Y,Z];
}

function color_bar()
{
    cbar=zegraph("colorbar");
    cbar.add(1,0,0,.1);
    cbar.add(0,1,0,.9);
    cbar.interpolate(4);
    cbar.position(.1,.92,.8,.02);
    cbar.labeldigits(2);
    return cbar;
}

Example-12 (for vertex)

load("zegraph.dll","matrix.dll");

// setup scene
[render,scene]=zegraph("render","scene");
render.size(800,600);
render.add(scene);

// construct line from GSHHS coastline data
line=zegraph("line");
scene.add(line);
line.gshhs("data/gshhs_c.b",-180,180,-90,90);

// show latitude, longitude in global coordinate
render.show();

// apply Wagner projection to vertices
scale=120.0;
vert=line.vertex();
vert.wagner(scale);

// and grid liones

ygrid=zegraph("line");
scene.add(ygrid);
ygrid.type("lines");
ygrid.dash(1);
for (y=-90; y<=90; y+=30) {
    ygrid.add(-180,y,0, 180,y,0);
}
vert=ygrid.vertex();
vert.wagner(scale);

for (x=-180; x<=180; x+=30) {
    xgrid=zegraph("line");
    scene.add(xgrid);
    xgrid.type("strip");
    xgrid.dash(1);
    for (y=-90; y<=90; y+=5) {
        xgrid.add(x,y,0, x,y,0);
    }
    vert=xgrid.vertex();
    vert.wagner(scale);
}

render.show();

// now let's make Pacific in the center for Wagner projection

// get half of GSHHS
line.gshhs("data/gshhs_c.b",0,180,-90,90);
// translate x from [0,180] to [-180,0];
vert=line.vertex();
vert.translate(-180,0,0);
// apply Wagner projection
vert.wagner(scale);

// create a new line object
line=zegraph("line");
scene.add(line);
// get another half of GSHHS
line.gshhs("data/gshhs_c.b",180,360,-90,90);
// translate x from [180,360] to [0,180];
vert=line.vertex();
vert.translate(-180,0,0);
// apply Wagner projection
vert.wagner(scale);

render.show();