I want to draw the image and morph it. I read all reference but not found how to draw simple 2D texture on shader.

First of all: hi!

I'm quite new to processing and my first encounter with it was during a course. But now the actual question:

I have produced a script regarding a rock-paper-scissors game (in Bacteria) in which we also tried to involve a spatial effect, more specifically: the amount of neighbours from the same strain of bacteria will improve your chances on victory. But I believe the code is more less okay. Now the - actual -thing is, in order to come up with something usefull I will need multiple runs (i.e. replicates) of this simulation (so that I can graph it afterwards in R with confidence intervals). At the moment my code runs one time and does 400 time-steps and this is printed in a .txt-file in the folder. Now I would like to run my code several times (e.g. 50 or 100 times) and have all of these as output but under a different name (e.g. Morph_abundances_Test[i].txt, where i is 1,2,3,4,....,50 or even 100).

I figured that my I could declare my output as follows: output = createWriter("C:/.../Morph_abundances_Test" + i + .txt")

and I was guessing a for-loop in which I declare i and say it should end at 50 (/100), but this doesn't work. Also it's important that every time the code runs every well is assigned randomly (so not that I would just use more than 400 time steps and just divide these).

I know my code it a little long, but the main thing is the "looping" in order to get some replicates in my folder, so that I won't have to change my code manually every time I run it, because in the end I will run multiple scenario's with different parameters (e.g. different initial percentages of morphs)

int cellSize = 5;

float Red;
float Blue;
float Yellow;
long maximumTime = 400;
float Time;       
float dt;
int neighbours = 0;
float nchance;
float Redshare;
float Blueshare;
float Yellowshare;
float totalCells;

PrintWriter output; 

// Colors for three different morphs
color RedColor = color(255, 0, 0);
color BlueColor = color(0, 0, 255);
color YellowColor = color(255, 255, 0);

// Array of cells
individual[][] cells;
// Buffer to record the state of the cells and use this while changing the others in the interations
individual[][] cellsBuffer; 

int numCellsX, numCellsY;

// Pause
boolean pause = false;

void setup() {
  size (500, 500);

  numCellsX = width/cellSize;
  numCellsY = height/cellSize;
  totalCells = numCellsX*numCellsY;

  Time = 0;
  dt   = 1;

  // Instantiate arrays 
  cells = new individual[numCellsX][numCellsY];
  cellsBuffer = new individual[numCellsX][numCellsY];

  // This stroke will draw the background grid
  stroke(48);

  noSmooth(); // Initialization of cells

  for (int x=0; x<numCellsX; x++) {
    for (int y=0; y<numCellsY; y++) {
      individual thisind = new individual();
      cells[x][y] = thisind;
    }
  }

  background(0); // Fill in black in case cells don't cover all the windows
  output = createWriter("C:/.../Morph_abundances_Test.txt"); // Creates the stream
  output.println("Time\tRed\tBlue\tYellow"); // Create the header of the data file
}

void draw() {

  //Draw grid
  for (int x=0; x<numCellsX; x++) {
    for (int y=0; y<numCellsY; y++) {
      if (cells[x][y].morph == 2) {
        fill(RedColor); 
      }
      else if (cells[x][y].morph == 1) {
        fill(BlueColor);
      }
      else if (cells[x][y].morph == 0) {
        fill(YellowColor); 
      }
      rect (x*cellSize, y*cellSize, cellSize, cellSize);
    }
  }      

  for (int x=0; x<numCellsX; x++) {
    for (int y=0; y<numCellsY; y++) {
      cellsBuffer[x][y] = cells[x][y];
    }
  }

  // Visit each cell:
  for (int x=0; x<numCellsX; x++) {
    for (int y=0; y<numCellsY; y++) {           
      int minx = 0;
      int maxx = 3;
      int miny = 0;
      int maxy = 3;

      if(x ==numCellsX-1) { maxx = 2;}
      if(x ==0 ) { minx = 1;}
      if(y ==numCellsY-1) { maxy = 2;}
      if(y ==0 ) { miny = 1;}

      // Draw random neighbour
      int randx = 0;
      int randy = 0;
      while(randx == 0 && randy == 0){
        randx = floor(random(minx,maxx) -1);
        randy = floor(random(miny,maxy) -1);
      }

      // PLUS check the strain of every neighbour of focal cell
      for (int xx=x-1; xx<=x+1;xx++) {
        for (int yy=y-1; yy<=y+1;yy++) { 
         if (((xx>=0)&&(xx<numCellsX))&&((yy>=0)&&(yy<numCellsY))) { // Make sure you are not out of bounds
          if (!((xx==x)&&(yy==y))) { // Make sure to not check against self
            if (cellsBuffer[x][y].morph == cellsBuffer[xx][yy].morph){
              neighbours ++; //
              }
          }
         }
        }
      }
      cellsBuffer[x][y].neighbours = neighbours; 
      //attach chance to the amount of neighbours of the same strain
      cellsBuffer[x][y].nchance = (neighbours / 8) * 100;

      //PLUS every neighbour of the randomly picked cell
      for (int xx=x-1; xx<=x+1;xx++) { 
        for (int yy=y-1; yy<=y+1;yy++) { 
         if (((xx>=0)&&(xx<numCellsX))&&((yy>=0)&&(yy<numCellsY))) { // Make sure you are not out of bounds
          if (!((xx==x)&&(yy==y))) { // Make sure to not check against self
            if (cellsBuffer[x+randx][y+randy].morph == cellsBuffer[xx][yy].morph){
              neighbours ++; //
              }
          }
         }
        }
      }
      cellsBuffer[x+randx][y+randy].neighbours = neighbours;
      //attach chance to the amount of neighbours of the same strain
      cellsBuffer[x+randx][y+randy].nchance = (neighbours / 8) * 100;

      //Interaction (Rock-paper-scissors game incl. spatial effects)
      if  (cellsBuffer[x][y].morph == 2 && cellsBuffer[x+randx][y+randy].morph == 0 &&
      cellsBuffer[x][y].neighbours <= cellsBuffer[x+randx][y+randy].neighbours &&
      ceil(random(100)) <= cellsBuffer[x+randx][y+randy].nchance ){
        cells[x][y].morph = 0; //Red vs Yellow (Yellow wins)
      }
      else if (cellsBuffer[x][y].morph == 1 && cellsBuffer[x+randx][y+randy].morph == 2 && 
      cellsBuffer[x][y].neighbours <= cellsBuffer[x+randx][y+randy].neighbours &&
      ceil(random(100)) <= cellsBuffer[x+randx][y+randy].nchance){
        cells[x][y].morph = 2; //Red vs Blue (Red wins)
      }
      else if (cellsBuffer[x][y].morph == 0 && cellsBuffer[x+randx][y+randy].morph == 1 && 
      cellsBuffer[x][y].neighbours <= cellsBuffer[x+randx][y+randy].neighbours &&
      ceil(random(100)) <= cellsBuffer[x+randx][y+randy].nchance){
        cells[x][y].morph = 1; //Blue vs Yellow (Blue wins)
      }
      else {
        cells[x][y].morph = cellsBuffer[x][y].morph;
      }
    } //for x
  } //for y
   // Visit each cell:
  for (int x=0; x<numCellsX; x++) {
    for (int y=0; y<numCellsY; y++) {
      if (cellsBuffer[x][y].morph == 2){
        Red += 1;
      }
      if (cellsBuffer[x][y].morph == 1){
        Blue += 1;
      }
      if (cellsBuffer[x][y].morph == 0){
        Yellow += 1;
      }
    } //for x
  } //for y
  Redshare = Red/totalCells;
  Blueshare = Blue/totalCells;
  Yellowshare = Yellow/totalCells;

  println ("Time: " + Time + "\t Red: " + Redshare + "\t Blue: " + Blueshare + "\t Yellow: " + Yellowshare);

  String growthDataStr = Time + "\t" + Redshare*100 + "\t" + Blueshare*100 + "\t" + Yellowshare*100;   //*100 to get it the percentage
  output.println(growthDataStr);
  //Every morphcount should be brought back to 0
  Red = 0;
  Blue = 0;
  Yellow = 0;


  Time = Time + dt;

  if(Time >= maximumTime){
    output.flush();
    output.close();
    exit();
    }
}

and then there's also my class:

class individual {

  int morph;
  float state;
  int neighbours;
  int nchance;

  float yellow_prob = 0.333333; // % chance of yellow color
  float blue_prob = 0.333333;   // % chance of blue color
  float red_prob = 0.333333;    // % chance of red color 
  individual(){
    //morph
    state = random(1);
    if (state < yellow_prob) {
          morph = 0;  //Yellow
      }
      else if (state < yellow_prob + blue_prob) {
        morph = 1; //Blue
      }
      else {
        morph = 2; //Red
      }
    }
}

Thanks in advance! And my apologies might this be too complex, other comments/suggestions regarding my code are more than welcome too!

Hi everyone

I'm a total novice to Processing so maybe this is a simple Question, although it is quite difficult to frame: Is it possible to automatically complete the steps between one shape and a second shape? For example in the image below i have two drawings, and i would like to automatically fill in the gap so that the first form transforms into the second. Like you can do it with the blend tool in illustrator.

Thank you for any help and happy new year!

This code was given to us in class as an example, but my prof has a rough accent and its hard to understand her. here is the code:

/* Colour Morph
   Example for COMP 1010

   Draw a bar across the centre of the window, with height
   BAR_HEIGHT, that consists of NUM_STEPS rectangles of
   equal width, with the left one having the colour set by
   INIT_RED, INIT_GREEN, INIT_BLUE, and the right one set by
   FINAL_RED, FINAL_GREEN, and FINAL_BLUE, and changing
   smoothly in between.
*/

size(700,200); //Make it wide but not too tall.

final int NUM_STEPS = 8; //The number of different coloured bars to use
final int BAR_HEIGHT = 150; //The height of the bar
final float BAR_WIDTH = (float)width/NUM_STEPS; //The width of each small slice
final float INIT_RED=156, INIT_GREEN=63, INIT_BLUE=178; //Initial colour
final float FINAL_RED=25, FINAL_GREEN=162, FINAL_BLUE=159; //Final colour

for(int i=0; i<NUM_STEPS; i++){
  //i will be 0,1,...,NUMSTEPS-1
  float position = i/(NUM_STEPS-1.0); //A value from 0.0 to 1.0
  float redValue = INIT_RED+(FINAL_RED-INIT_RED)*position;
  float greenValue = INIT_GREEN+(FINAL_GREEN-INIT_GREEN)*position;
  float blueValue = INIT_BLUE+(FINAL_BLUE-INIT_BLUE)*position;
  fill(redValue,greenValue,blueValue);
  stroke(redValue,greenValue,blueValue); //Make the outline match, too.
  rect(i*BAR_WIDTH,(height-BAR_HEIGHT)/2,BAR_WIDTH,BAR_HEIGHT);
}//for

In the loop, why do we use those operations? If I was asked to code this on an exam, how would I know to do that?? I dont get the logic behind it

Have you looked at the morph example?

• https://processing.org/examples/morph.html

I'm starting to mess with this but my first question is what points are returned by PShape getVertex? Is there a way to generate more points along the paths of an SVG shape?

Does it even make sense to try and preserve the paths that connect points in the shapes or should I just connect all the dots linearly?

Thanks for any help on this, I'm still fairly new to this stuff so I'm trying to wrap my head around it.

I am using a recursive trig function to make super high definition symmetrical spiral shapes that morph into one another, but because of the computation involved, it is very slow: ~6 hours for a minute of footage (1440 frames) on my mbp.

The P2D renderer doesn't make it go that much faster on my computer, but I thought there might be a way to make use of a GPU instance on EC2 via OpenGL?

Thanks to one of Daniel Shiffman's tutorials, I managed to get a sketch running on EC2 and exporting .png files using the default renderer - would I just be better off getting a compute instance and using the default renderer? I was curious so I hired a larger compute instance, but it rendered the frames only very slightly faster than the free tier instance.

Any advice / pointers / resources wrt rendering headless on EC2 would be amazing!!

@KomarovMaksim --

For face morphing, see the Shiffman "Face-It" workshop materials on faces in Processing:

• https://github.com/shiffman/Face-It

...in particular, the Face Morphing demo sketches:

• https://github.com/shiffman/Face-It/tree/master/FaceMorphing

...you can also find previous discussions of this just by searching the forum!

• https://forum.processing.org/two/search?Search=morphing
• https://forum.processing.org/two/discussion/18350/morph-2-images

I want to be able to make a code using my live camera, and detectiong facial features so i can expand on that and morph or manipulate facial features, anyone know anything about that? do i need to download a library?

Simple question...I have a triangle made with triangle() and I would like to morph / tween it into 2 rectangles when you click on it...think play / pause button...any suggestions on how I should proceed with this?

I am using p5.js and not processing btw.

Thanks!

i´m starting with 2 images, and i wanna morph them

https://forum.processing.org/two/search?Search=morph

Say more about what you are trying to accomplish. Do you mean cross-fade two images, e.g. with [tint()]? Or do you mean feature-based morphing, like two-face morphing? How many images, of what kind?

See also:

• Morphing images from one to another in processing?
• for shapes, How to make a Circle to Square pattern, or shape to another shape pattern

Hi, is there a simple shader to morph to images?, thanks :)

Not perfect, but this interpolates between 2 polygons of (different) n sides. Quite a complicated way of setting out spokes, then limiting the magnitude for those ones not needed, but used in interpolating the next shape.

    // this interpolates from a shape of random sides to a shape of a different, random number of sides

    int tileX, tileY;
    int tileDistance = 60;
    float tileNumber = 0;

    PolygonN shapeone, shapetwo;
    int maxSides = 6;
    float amt = 0;

    int n, maxN, n2; 

    PVector origin;
    int radius = 20;
    int originX, originY;

    void setup() {
      size (800, 600);
      background(0);
      stroke(255);
      strokeWeight(2);

      originX = width / 2;
      originY = height / 2;

      n = (int)random(maxSides) + 3;
      n2 = (int)random(maxSides) + 3;
      if (n == n2) {
        n2 = n + 1;
      }
      maxN = n * n2 * 20;

      shapeone = new PolygonN(n, maxN, radius);
      shapetwo = new PolygonN(n2, maxN, radius);

      shapeone.setupPolygon();
      shapetwo.setupPolygon();
    } // end setup

    void draw() {

      for (tileY = tileDistance / 2; tileY < height; tileY += tileDistance) {
        for (tileX = tileDistance / 2; tileX < width; tileX += tileDistance) {
          pushMatrix();
          translate(tileX, tileY);
          amt = map(dist(tileDistance, tileDistance, tileX, tileY), 0, dist(tileDistance, tileDistance, width - tileDistance, height - tileDistance), 0, 1);
            stroke(lerpColor(color(255, 0, 0), color(0, 0, 255), amt));

          PVector[] morph = new PVector[maxN];

          noFill();
          beginShape();
          for (int i = 0; i < maxN; i ++) {
            morph[i] = PVector.lerp(shapeone.v[i], shapetwo.v[i], amt);
            vertex(morph[i].x, morph[i].y);
          }
          endShape(CLOSE);
          popMatrix();
        }
      }
      noLoop();
    } // end draw


    class PolygonN {
      int sides;
      int spokes;
      int radius;
      PVector[] v; // all spokes from origin
      PVector[] spoke; // spokes to each corner ie used spokes
      PVector origin = new PVector(0, 0);

      PolygonN(int n, int m, int r) {
        sides = n;
        spokes = m;
        radius = r;
      }

      void setupPolygon() {

        float theta = TWO_PI / sides; // angle between sides
        float thetaSpokes = TWO_PI / spokes; // angle between spokes
        int currentSpoke = 1;
        PVector overlap; // working vector to tell if spokes too long

        spoke = new PVector[sides+1];
        v = new PVector[spokes];

        for (int i = 0; i < sides; i ++) { // set up n used spokes
          spoke[i] = PVector.fromAngle(theta * i); 
          spoke[i].setMag(radius);
        }
        spoke[sides] = spoke[0]; // to loop around

        for (int i = 0; i < spokes; i ++) { // set up spokes non used spokes
          v[i] = PVector.fromAngle(thetaSpokes * i); 
          v[i].setMag(radius); // ful length so overlaps side
          if ((i * thetaSpokes) > (currentSpoke * theta)) { // if current angle past current used spoke, move on to next spoke 
            currentSpoke ++;
          }
          overlap = lineIntersection(spoke[currentSpoke], spoke[currentSpoke-1], origin, v[i]);
          if (overlap !=null) { 
            float distance = dist(overlap.x, overlap.y, 0, 0);
            v[i].setMag(distance);
          }
        }
      }
    }

    PVector lineIntersection(PVector p1, PVector p2, PVector p3, PVector p4) {
      PVector b = PVector.sub(p2, p1);
      PVector d = PVector.sub(p4, p3);

      float b_dot_d_perp = b.x * d.y - b.y * d.x;
      if (b_dot_d_perp == 0) { 
        println("1st overlap error");
        return null;
      }
      PVector c = PVector.sub(p3, p1);
      float t = (c.x * d.y - c.y * d.x) / b_dot_d_perp;
      if (t < 0 || t > 1) { 
        println("2nd overlap error");
        return null;
      }
      float u = (c.x * b.y - c.y * b.x) / b_dot_d_perp;
      if (u < 0 || u > 1) { 
        println(u + "<-u 3rd overlap error");
        return null;
      }
      return new PVector(p1.x+t*b.x, p1.y+t*b.y);
    }

Is there a way of getting it between to morph between polygons of n sides?

edit - looks like this is how to draw polygon of n sides, next step to lerp betweeen vertices. not tested yet, so bound to have an error or two.

    int n = 3;
    float radius = 30;
    float theta = TWO_PI / n;

    beginShape();     
    for (int i = 0; i < n; i ++) {
        float x = radius * cos(theta * i);
        float y = radius * sin(theta * i);
        vertex (x , y);
    }
    endShape(CLOSE);

Nice one @TfGuy44 & nice idea @jsr

Been playing with the original code but don't know PVector class well enough.

I'd meant to spend this evening sorting out a drum sequencer in arduino, but really liking Islamic art made this too interesting to miss.

Anyway, this is a simple tiling of code above:

`int tileX, tileY;
int tileDistance = 30;
float tileNumber = 0;

void setup() {
  size(640, 360);
  noFill();
  stroke(255);
}

void draw() {
  background(51);
  noLoop();
  for (tileY = 0; tileY < height; tileY += tileDistance) {
    for (tileX = 0; tileX < width; tileX += tileDistance) {
      tileNumber ++;
      strokeWeight(2);
      morph_shape(tileNumber);
    }
  }
}

void morph_shape(float amt) {
  rect(tileX, tileY, tileDistance, tileDistance, amt/5);
}
`

But being able to morph between different shapes would be amazing - PVector looks to be the way to go, but how to deal with polygons of different numbers of sides - how to morph between a square and a triangle?

Hi there,

Im wanting to make a pattern that would have a simple for loop repeating pattern. Im thinking of something that starts on one quadrant and finishes on another quadrant. For sake of discussion a triangle that morphs in to a square?

I saw this https://processing.org/examples/morph.html which helps me think about how to morph a shape, but not sure if the same rule would apply for wanting to make a pattern.

Generative Design has a similar sketch http://www.generative-gestaltung.de/P_2_1_2_03 but I do not need sketch to move, a still image is totally fine.

Any help is much appreciated!

Hi, Is it possible in processing to morph few images from one two another to create something like in the following gif: https://media.giphy.com/media/c8ygOpL64UDuw/giphy.gif

There are plenty of software to to this, but I need to be interactive. I'll have webcam that captures two images, and then should be created video clip from the warping process of those 2 images.

Thanks in advance

I'm making a top down space shooter. Currently I'm having difficulty with two things right now.

1. When my bullet is shot from the ship (use space key to fire) it moves side to side as it flies, moving on the x-axis the war it did before shooting. I want it to start from the x position of the ship, and then fly straight without interference from the mouse. (it doesn't affect the enemies yet, that's fine)

2. Array lists. I tried to put my bullets into an array list, but I couldn't get them to respawn where the first bullet spawns. They kept appearing in the top left corner. I also don't want them to shoot right away, I want them to spawn, and wait for the space bar to be pressed again before shooting.

`

    float startTime; //# of milliseconds since start of program
    float currTime; //# of milliseconds since last drawn ship
    float hitTime; //rate ships come onto screen
    float follow = 0.05; //rebel's slow
    float imgy = 1; //bg img ypos
    float imgspeed = 1; //bg image speed
    int score; //score
    int startscore; //score base
    int savedScore; //current score
    int moveX, moveY; //mouseX, mouseY
    boolean stayDead = false; //You start off alive
    boolean mousePress = false; //mouse isn't currently pressed
    boolean score_Reset = false; //score isn't reset
    boolean space = false;


    ArrayList<Ship> ships = new ArrayList<Ship>(); //create array list for ships



    class Rebel {
      color cc; // rebel colour variable
      float x; // rebel x pos
      float y; // rebel y pos
      float r; // rebel width/ height  
      boolean hit = false;

      Rebel() {
        cc = color(#D1E2FF); // define rebel colour
        }

        boolean checkCollision(Ship sl) { //a yes/no if the rebel has collided with a ship
          hit = shipRebel(sl.xpos, sl.ypos, sl.shipwidth, sl.shipheight, x, y, r); //a yes/no for if a ship touches rebel
          if (hit == true) return true; //if hit is true,  checkCollision is true
          else return false; //otherwise checkCollision is false
        }

        void display() { // rebel display
         noStroke(); //no outline
         if (hit == true) { //if a ship touches the rebel
         fill(#000000); // unused
         stayDead = true; //stop displaying
       }
         else fill(cc); //otherwise, fill normally
         ellipse(x, y, r, r); //and create the rebel
         imageMode(CENTER);
         //image(Rebelpng, x, y);
        }

        void run() { // rebel movement
        float mx = moveX -x; //these two lines create the x variable
        x += mx* follow; // basically, mouseX * follow (-x, +x cancel out)
        float my = moveY - y; //mouse Y * 0.05
        y += my* follow; // -y, +y cancel out
        r=30; //rebel width and height
        }
    }


    boolean shipRebel(float sx, float sy, float sw, float sh, float tx, float ty, float diameter) {
      //sx = ship xpos, sy = ship ypos, sw = ship width, sh = ship height, tx= rebel xpos, ty = rebel ypos, diameter = rebel diameter

      float testX = tx; //testing x positions for collision -- rebel xpos
      float testY = ty; //testing y positions for collision -- rebel ypos

      /*ship width/height is /2 because ship is in rect(CENTER) mode, displayed from center and not corner*/

      if (tx < sx - sw/2)       //if rebel xpos is less than ship xpos, - half the ship width
        testX = sx - sw/2;    //testX will be equal to the ship xpos, - half the ship width
      else if (tx > sx + sw/2)  //otherwise, if rebel xpos is greater--
        testX = sx + sw/2;    //testX will be equal to the ship xpos + half the ship width
      if (ty < sy - sh/2)       //if rebel ypos is less than ship ypos, - half the ship height
        testY = sy - sh/2;    //testY will be equal to the ship ypos, -half the ship height
      else if (ty > sy + sh/2)  //otherwise, if rebel ypos is greater--
        testY = sy + sh/2;    //testY will be equal to the ship ypos, + half the ship height

      float distX = tx-testX;   //x distance is rebel xpos - testX
      float distY = ty-testY;   //y distance is rebel ypos - testY
      float distance = sqrt( (distX*distX) + (distY*distY) );  //more calculations. I tested this on paper, it works.
      /*distance is the square root (a positive number) of 
       */
      if (distance <= diameter/2) { //if the distance from ship is less than diameter of rebel...
        return true; //hit is true
      }
      return false; //otherwise it's not.
    }


    class Ship {
      color c; // Ship color
      float xpos; // ship x pos
      float ypos; // ship y pos
      float xspeed; // ship speed x direction -- unused
      float yspeed; //ship speed y direction
      int shipwidth = 40;
      int shipheight = 50;

      Ship() {
        c = color(#5FB277); 
        xpos = int(random(width)); // x position is random, within the width of the screen
        ypos = -shipheight; // y position is top - height of ship
        xspeed = 0; // unused
        yspeed = int(random(2,6)); // ship speed down screen
      }


      void display() {
        rectMode(CENTER); //rectangle mode is centre positionx, cp y, width, height
        noStroke();
        fill(c);
        rect(xpos, ypos, shipwidth, shipheight); 
        imageMode(CENTER);
        //image(Enemy1png, xpos, ypos); //enemy image file
      }


      void flight() {
        ypos = ypos + yspeed; //place ship at start and add speed
        if (ypos > height + 50) {
          ypos = -shipheight; //start at top - shipheight
        xspeed = 0; //unused
        }
      }
    }

    class Bullet {
      color cbullet;
      float bullx;
      float bully;
      float bullr;
      float bullyspeed;

      Bullet () {
        cbullet = (#FFFFFF);
        bullr = 10;

      }

      void display() {
        noStroke();
        ellipse (bullx, bully, bullr, bullr);
      }

      void follow() {
        float mbullx = moveX -bullx; //these two lines create the x variable
        bullx += mbullx* follow; // basically, mouseX * follow (-x, +x cancel out)
        float mbully = moveY - bully; //mouse Y * 0.05
        bully += mbully* follow; // -y, +y cancel out
      }

      void shoot() {    
        float mbullx = moveX -bullx; //these two lines create the x variable
        bullx += mbullx* follow; // basically, mouseX * follow (-x, +x cancel out)
        float mbully = moveY - bully; //mouse Y * 0.05
        bully += mbully* follow; // -y, +y cancel out


        if (space == true) {
        bullyspeed = 10;
        bully = (bully - mbully*follow) - bullyspeed;
        }
      }
    }

    Ship s; //Ship class shortened to s
    Rebel t; //Rebel class shortened to t
    Bullet b; //Bullet class shortened to b


    void setup() {
      size(800, 800, P2D); //screen size
      smooth(); 
      s = new Ship(); //add new ship with s
      t = new Rebel(); //add player with t
      b = new Bullet();
      ships.add(s); //add ships to array list
      hitTime = 1000; //rate ships come onto screen
      startTime = millis(); //# of milliseconds since start of program
      startscore = millis() / 100; //score -- 10pts / sec
    }


    void draw() {
      cursor(CROSS); //make cursor cool
      background(#000000);
      imgy+=imgspeed; //bg y position is y position + speed
      imgy%=height;  
      /* Remember that % is remainders: remainders loop. 
       4 % has four (0,1,2,3) remainders- height (800) has 800 (0-799)-- thus the image loops)*/

      b.display();

      if (stayDead == false) { //if still alive
        for (int i=0; i < ships.size(); i++) { //for each ship in the array
          Ship tempShip = ships.get(i); //check the ship
          if (t.checkCollision(tempShip) == true) { //check if it collides with rebel
            i = ships.size();
          }      
          t.display(); //display rebel only if alive
        }
      }


      if (mousePressed) { //if the mouse is pressed
        stayDead = false; //you're alive
        mousePress = true; //you've pressed the mouse
        score_Reset = true; //and the score is reset
      }


      t.run(); //run the rebel ship

      for (int i =0; i < ships.size(); i++) { //for each ship in the array
        Ship tempShip = ships.get(i); //look at each ship,
        tempShip.flight(); //run
        tempShip.display(); //and display
      }
      currTime = millis() - startTime; //millis since draw sequence - millis since start of program
      if (currTime >= hitTime) { //if the current milliseconds since start is over 1000 (1 second)
        startTime = millis(); //set start time to current millis
        Ship s = new Ship(); //create a new ship
        ships.add(s); //add ship to arraylist
      }
      for (int i = 0; i < ships.size(); i++) { //for each ship in the array
        if (mousePressed) { //if the mouse is pressed
          ships.remove(i); //remove them from array
        }
      }

      score = (millis() / 100) - startscore; //score
      if (score_Reset == true) { //if score is reset by mousepress
        startscore = millis() /100; //start score is reset
        score_Reset = false; //currently score isn't reset
      }
      if (stayDead == false) { //if you are alive
        fill (#FFFFFF); //display text
        //textFont(Morph18); //score font
        text("Score:", 30, 20); //"Score:"
        text(int(score), 70, 20); // score #
      } else { //if you are dead
        savedScore = score; //saved score is current score
        textSize(20);
        fill (#FFFFFF);
        //textFont(Bofah); //score font
        text("GAME OVER", width/2, height/4 - 50); //Game Over text
        //textFont(Morph);
        text("Double-Click to Play Again", width/2, height/4 +200); //Instructions
        //textFont(Bofah); //score font
        text(int(savedScore), width/2, height/4);//score when died
        noLoop(); //stop running program
      }

      if (mousePress == false) { //if mouse isn't pressed
        fill (#FFFFFF);
        textAlign(CENTER);
        textSize (12);
        //textFont(Morph); //text font
        text("AVOID ENEMY SHIPS", width/2, height/3 -60); //Display instructions
        text("click to begin", width/2, height/3 +40);    
      }

      if (space == true) {
        b.shoot();
      }else{
        b.follow();
      }

    }

    void mousePressed() { //if mouse is pressed
      loop(); //continue running program

    }

    void mouseMoved() { //if mouse is moved
      moveX = mouseX; //Rebel xpos
      moveY = mouseY; //Rebel ypos
    }


    void keyPressed() {
        if (key == ' ') {
         space = true; 
      }
    }

`

Sure, here are some images where I switch out x2 with x3 and so on with y and z as well. Yeah the slices and stacks are just latitude and longitude.

I feel like I must be close, just can't get it where it doesn't look like its twisting all the way up.

It looks like these: https://www.dropbox.com/sh/5o04zj93ngh15na/AAA2Oqf8OPR7VPpKz2MrN0aYa?dl=0

I want it to look like this, but using the code structure I have because I'd like to morph this sphere using parametric math similar to the morphingbook.com link: