How to use Shape 3D library to make a hemispheres and have specific textures in specific locations?

jimbojohn

Dear enthusiasts :),

I have been using the Shapes 3D library for one of my projects and I must say it is quite good. However, I had two questions which I could not find an answer to in the forum or in the provided examples in the library’s folder: 1. How to do a hemisphere? I tried manipulating an ellipsoid, but I could not make a hemisphere out of it. Nonetheless, I thought of putting a white cube underneath a sphere and cut it to make it a hemisphere, but then I find that a bit dodgy and hope there is a better way of doing it.

1. How can I put textures or images in certain location of a shape, specifically an ellipsoid? For example having a picture or texture in front of an ellipsoid to make it look like the front windows of a plane. I thought of using the “MeshSection” function in the library, but I could not do it.

Any help and guidance is appreciated :D.

quark

The sketch below demonstrates how to use MeshSection to create a hemisphere

Some points to note.
1) Each MeshSection is created for a specific shape, so the number of segments should be the same as the shape plus 1 (See lines 12 & 19)
2) A MeshSection defines the surface area of the shape to be shown. It does not realign the texture.
3) Multiple MeshSections can be added to a shape to draw a discontinuous surface
4) You cannot define the start and end positions of a texture image on an Ellipsoid

I suggest you experiment by changing the values in line 20

import shapes3d.utils.*;
import shapes3d.animation.*;
import shapes3d.*;

Ellipsoid globe;
MeshSection ms;
float a = 0;

void setup() {
  size(400, 400, P3D);
  cursor(CROSS);
  globe = new Ellipsoid(this, 32, 32);
  globe.setSize(100, 100, 100);
  globe.fill(color(200, 0, 200));
  globe.stroke(color(64, 0, 64));
  globe.strokeWeight(0.6);
  globe.drawMode(S3D.SOLID | S3D.WIRE);
  // Same as globe sections but add 1 to each
  ms = new MeshSection(33, 33);
  ms.setRange(0, 32, 0, 16);
  globe.addDrawSection(ms);
  // Further sections can be created and added here
}

void draw() {
  background(128);
  translate(width/2, height/2);
  pushMatrix();
  rotateX(a);
  rotateY(a/1.2345);
  globe.draw();
  popMatrix();
  a += 0.01;
}

With respect to the 'view out of the plane' the usual way to do this is draw the exterior view and then draw the interior surface of the plane on top.

jimbojohn

Hi :),

Thank you very much for your reply. I have included my code at the bottom. You can just get rid of the texture codes and use “fill” as I could not attach them. The code should produce an ellipsoid (supposed to be a submarine :)) ) which has a quarter circle as its tale, two cylinders (or tubes) at each side to act as lights, a periscope on top of it and the ellipsoid is being cut by a cube which has only a thickness of 1 units to represent the water level. I am more than happy to share this with everyone, even though it is a bit crude :-S . However, I would really appreciate it if anyone has any ideas and suggestions to improve it. For example I was wondering if one could have a small picture of a flag on the tail or other features such as a door and front windows. Moreover, I did not really understand it when you said this:

With respect to the 'view out of the plane' the usual way to do this is draw the > exterior view and then draw the interior surface of the plane on top.

Actually I ended up putting a flag on the tail, but to do that I made a thin cube and put the image on it and shifted it on the tail. (I am referring to “box2” object in the code). Please let me know if you have a better suggestion for this. Here is a picture of what I have: http://postimg.org/image/jcsusp9yv/

Many thanks in advance!!

`
import shapes3d.utils.*;
import shapes3d.animation.*;
import shapes3d.*;
import peasy.*;

PeasyCam camera;
Ellipsoid ellipsoid;
Ellipsoid ellipsoid2;
Ellipsoid ellipsoid3;
//Ellipsoid ellipsoid4;
Tube tube; // Vertical part of periscope
Tube tube2; // Horizontal part of periscope
Tube tube3; // Tube to the side
Tube tube4; // Tube to the side
Box box; // 
Box box2;
MeshSection ms;

int flag = 0;
int eye = 0;
int light = 0;

// Array to simplify the selection of the 
Shape3D[] shapes;
float angleX, angleY, angleZ;

public void setup() {
size(600, 400, P3D);
camera = new PeasyCam(this, 0, 0, 0, 100);
// Use this to have fixed lighting
cursor(CROSS);
textFont(createFont("DIALOG", 16));

tube = new Tube(this, 4, 50);
tube.setSize(10, 10, 10, 10, 70);
tube.fill(color(150, 150, 150));
tube.fill(color(150, 150, 150), S3D.BOTH_CAP);
tube.drawMode(S3D.SOLID);
tube.moveTo(0, -50, 0);

tube2 = new Tube(this, 4, 50, new PVector(1, 0, 0), null);
tube2.setSize(8, 8, 8, 8, 40);
tube2.fill(color(150, 150, 150));
tube2.setTexture("eyeo.png", S3D.S_CAP);
//tube2.fill(color(150, 150, 150),S3D.BOTH_CAP);
tube2.drawMode(S3D.SOLID);
tube2.drawMode(S3D.TEXTURE, S3D.S_CAP);
tube2.moveTo(-15, -100, 0);
tube2.rotateBy(-20.5, 0, 0);

tube3 = new Tube(this, 4, 50, new PVector(1, 0, 0), null);
tube3.setSize(10, 10, 10, 10, 50);
tube3.fill(color(150, 150, 150));
tube3.setTexture("lighton.JPG", S3D.S_CAP);
//tube3.fill(color(150, 150, 150),S3D.BOTH_CAP);
tube3.drawMode(S3D.SOLID);
tube3.drawMode(S3D.TEXTURE, S3D.S_CAP);
tube3.moveTo(-15, -30, 50);

tube4 = new Tube(this, 4, 50, new PVector(1, 0, 0), null);
tube4.setSize(10, 10, 10, 10, 50);
tube4.fill(color(150, 150, 150));
tube4.setTexture("lighton.JPG", S3D.S_CAP);
//tube4.fill(color(150, 150, 150),S3D.BOTH_CAP);
tube4.drawMode(S3D.SOLID);
tube4.drawMode(S3D.TEXTURE, S3D.S_CAP);
tube4.moveTo(-15, -30, -50);


ellipsoid = new Ellipsoid(this, 16, 200);
//ellipsoid.setTexture("metal7.jpg");
ellipsoid.setTexture("shark1.jpg", 1, 1);
ellipsoid.setRadius(150, 50, 50);
//ellipsoid.drawMode(S3D.SOLID | S3D.WIRE);
ellipsoid.drawMode(S3D.TEXTURE);
//ellipsoid.stroke(color(160));
//ellipsoid.strokeWeight(0.6f);
// ellipsoid.moveTo(0,0,100);

ellipsoid2 = new Ellipsoid(this, 16, 200);
ellipsoid2.setRadius(15);
ellipsoid2.fill(color(150, 150, 150));
ellipsoid2.drawMode(S3D.SOLID);
//ellipsoid2.stroke(color(160));
//ellipsoid2.strokeWeight(0.6f);
ellipsoid2.moveTo(0, -95, 0);

ellipsoid3 = new Ellipsoid(this, 16, 16);
ellipsoid3.setRadius(60, 60, 0);
ellipsoid3.fill(color(12, 87, 174));
ellipsoid3.drawMode(S3D.SOLID);
//ellipsoid3.stroke(color(160));
//ellipsoid3.strokeWeight(100.0f);
ellipsoid3.moveTo(90, -20, 0);
ms = new MeshSection(17, 17);
ms.setRange(0, 3, 0, 10);
ellipsoid3.addDrawSection(ms);


box = new Box(this);
box.setTexture("ocean.jpg");
//box.fill(color(0));
//box.stroke(color(0));
//box.strokeWeight(1.2f);
box.setSize(700, 0, 700);
box.drawMode(S3D.TEXTURE);
box.shapeOrientation(null, new PVector(150, 0, -70));

box2 = new Box(this, new PVector(0, 0, -1), null);
box2.fill(color(12, 87, 174));
box2.setTexture("Uni.jpg");
//box.stroke(color(0));
//box.strokeWeight(1.2f);
box2.setSize(20, 1, 20);
box2.drawMode(S3D.SOLID, RIGHT);
box2.drawMode(S3D.TEXTURE, LEFT);
box2.moveTo(115, -55, 0);
//box2.rotateBy(0,0,90);
}

public void draw() {
    background(255);
    // 3D draw first
    pushMatrix();
    //camera(-200, -250, 100, 0, 0, 0, 0, 1, 0);
    //camera(0, 0, 300, 0, 0, 0, 0, 1, 0);
    box.draw();
    box2.draw();

    rotateX(angleX); // roll
    rotateY(angleY); // yaw
    rotateZ(angleZ); // pitch

    light++;

    if (light == 100) {
        tube3.setTexture("lighton.JPG", S3D.S_CAP);
        tube4.setTexture("lighton.JPG", S3D.S_CAP);
        light = 0;
    }


    if (light == 50) {
        tube3.setTexture("lightoff.JPG", S3D.S_CAP);
        tube4.setTexture("lightoff.JPG", S3D.S_CAP);
    }

    if (eye == 0) {
        tube2.setTexture("eyeo.png", S3D.S_CAP);
    }
    eye++;

    if (eye == 50) {
        tube2.setTexture("eyec.png", S3D.S_CAP);
        eye = 0;
    }
    // Draw selected shape
    ellipsoid.draw();
    ellipsoid2.draw();
    ellipsoid3.draw();
    tube.draw();
    tube2.draw();
    tube3.draw();
    tube4.draw();
    //rotateX(radians(45));

    popMatrix();



    /*if (angleX != 0.5 && angleZ != 0.5 && flag == 0 )
     {
     angleX +=0.1;
     angleZ +=0.1;
     }

     if (angleX == 0.5 && angleZ == 0.5  && flag == 0)
     {
     flag = 1;
     }


     if (angleX != 0 && angleZ != 0  && flag == 1)
     {
     angleX -=0.1;
     angleZ -=0.1;
     }
     if (angleX == 0 && angleZ == 0)
     {
     flag = 0;
     }
     */
}
/*void delay(int delay)
 {
 int time = millis();
 while(millis() - time <= delay);
 }*/` 

quark

With respect to the 'view out of the plane' the usual way to do this is draw the > exterior view and then draw the interior surface of the plane on top.

Imagine sitting in the plane but all the plane walls and controls etc are transparent. All you would see is the sky, clouds etc that is the exterior view. So draw that on the screen. Now image that the plane walls are no longer transparent (except for windows open doors etc) and draw that on top of the exterior view.

jimbojohn

Imagine sitting in the plane but all the plane walls and controls etc are transparent. All you would see is the sky, clouds etc that is the exterior view. So draw that on the screen. Now image that the plane walls are no longer transparent (except for windows open doors etc) and draw that on top of the exterior view.

I understand what you are saying, but I do not think I have done this before ( or maybe I have and I do not know it) :-S . I am not really sure how to go about doing this. Would you please be able to point me to a simple example?

Cheers!! :D

quark

This sketch simply uses 2 images but demonstrates the type of thing I mean. You can download the code and images from OpenProcessing. :)

jimbojohn

Beauuutiful! Thanks quark.