I am also trying to display each angle next to each point of inflexion. In the case of the elbow, I am trying to move the text with the elbow position along with the inflexion point. That works, but I cant find a method to keep the writing horisontal. It rotates with the first segment angle...

here is my function

thanks

void ArmDepiction()

{ ///////////////////////////Base orientation

fill(201, 0, 211); // magenta //text("Y:", LS, spaceDown*3 ); text( (nf(degrees(BaseAngRad), 0, 1)), 630, 1050); //text( "0", 85, 0);

strokeWeight(10); stroke(238,242, 0); noFill ();

// Form: arc(x, y, width, height, start, stop, type); arc(550, 1000, 100, 100, (PI/2), (BaseAngRad+(PI/2)), PIE); //stroke(#71B28F); //arc(100, 1000, 175, 175, 0, 2*PI, 0);

//drawArrow(100,160,50,130);

///////////////////////Arm Depiction strokeWeight(40); stroke(255, 160); strokeCap(ROUND);

float x, y;

x = 550; y = 800;

pushMatrix(); strokeWeight(40); segment(x, y, PI+ShoAngRad); strokeWeight(30); segment1(segLength, 0, PI+ElbowAngRad); // 120 is the starting point segment3(segLength, 0, (2*PI)+ElbowAngRad-0.58); // 100 is the segment length popMatrix();

translate(x, y); strokeWeight(10); strokeJoin(ROUND); beginShape(); vertex(-40, 0);

vertex(-65, segLength); vertex(65, segLength);

vertex(40, 0); endShape(CLOSE);

DisplayElAngle(x, y);

}

void segment(float x, float y, float a) { translate(x, y); fill(201, 0, 211); // magenta //text("Y:", LS, spaceDown*3 ); text( (nf(degrees(ShoAngRad), 0, 1)), 30, 0); //text( "0", 85, 0); noFill ();

rotate(a); line(0, 0, segLength, 0); // 100 is the segment length

}

void DisplayElAngle(float x, float y) { translate(x, y); rotate(2PI); fill(201, 0, 211); // magenta //text("Y:", LS, spaceDown3 ); text( (nf(degrees(ElbowAngRad), 0, 1)), 20, -10); noFill (); //

} void segment1(float x, float y, float a) { translate(x, y); fill(201, 0, 211); // magenta //text("Y:", LS, spaceDown*3 ); text( (nf(degrees(ElbowAngRad), 0, 1)), 20, -10); noFill (); rotate(a); line(0, 0, segLength, 0); // 100 is the segment length // rotate(a);

}

void segment3(float x, float y, float a) { translate(x, y); rotate(a); line(0, 0, (segLength/5), 0); // 100 is the segment length

}

Figure figure=new Figure();
PVector mus;
PVector dirx;
PVector diry;
float anglx;
float angly;
float locX=0;
float locY=0;


void setup()
{
  size(500,500,P3D);
  ortho();
  dirx=new PVector(0,0,0);
  diry=new PVector(0,0,0);
}



void draw()
{
  mus=new PVector(mouseX-pmouseX,mouseY-pmouseY,0);
  mus.setMag(0.04);

  dirx = new PVector(1,0,0);
  dirx.add(mus.copy());
  dirx.setMag(1);

  diry = new PVector(0,1,0);
  diry.add(mus.copy());
  diry.setMag(1);


  background(200);
  figure.display();
}



void mousePressed()
{
  locX=mouseX;
  locY=mouseY;
}



void mouseDragged()
{

  ellipse(locX,locY,5,5);

  float ax = figure.A.x-locX;
  float bx = figure.B.x-locX;
  float cx = figure.C.x-locX;

  float ay= figure.A.y-locY;
  float by= figure.B.y-locY;
  float cy= figure.C.y-locY;



  {// rotation by X axis

  float nax=(figure.A.x*1)+(0)+(0);
  float nay=(0)+(ay*dirx.x)+(figure.A.z*dirx.y);
  float naz=(0)+(ay*-dirx.y)+(figure.A.z*dirx.x);

  float nbx=(figure.B.x*1)+(0)+(0);
  float nby=(0)+(by*dirx.x)+(figure.B.z*dirx.y);
  float nbz=(0)+(by*-dirx.y)+(figure.B.z*dirx.x);

  float ncx=(figure.C.x*1)+(0)+(0);
  float ncy=(0)+(cy*dirx.x)+(figure.C.z*dirx.y);
  float ncz=(0)+(cy*-dirx.y)+(figure.C.z*dirx.x);


  figure.A.x=nax;
  figure.A.y=nay+locY;
  figure.A.z=naz;
  figure.B.x=nbx;
  figure.B.y=nby+locY;
  figure.B.z=nbz;
  figure.C.x=ncx;
  figure.C.y=ncy+locY;
  figure.C.z=ncz;
  }


  {// rotation by Y axis


  float nax=(ax*diry.y)+(0)+(figure.A.z*-diry.x);
  float nay=(0)+(figure.A.y*1)+(0);
  float naz=(ax*diry.x)+(0)+(figure.A.z*diry.y);

  float nbx=(bx*diry.y)+(0)+(figure.B.z*-diry.x);
  float nby=(0)+(figure.B.y*1)+(0);
  float nbz=(bx*diry.x)+(0)+(figure.B.z*diry.y);

  float ncx=(cx*diry.y)+(0)+(figure.C.z*-diry.x);
  float ncy=(0)+(figure.C.y*1)+(0);
  float ncz=(cx*diry.x)+(0)+(figure.C.z*diry.y);


  figure.A.x=nax+locX;
  figure.A.y=nay;
  figure.A.z=naz;
  figure.B.x=nbx+locX;
  figure.B.y=nby;
  figure.B.z=nbz;
  figure.C.x=ncx+locX;
  figure.C.y=ncy;
  figure.C.z=ncz;

  }
}




class Figure
{
  PVector A;
  PVector B;
  PVector C;


  Figure()
  {
    A=new PVector(random(width*2, width*4), random(width*2, width*4), random(width*2, width*4));
    B=new PVector(random(width*2, width*4), random(width*2, width*4), random(width*2, width*4));
    C=new PVector(random(width*2, width*4), random(width*2, width*4), random(width*2, width*4));
  }


  void display()
  {

    stroke(255, 150);
    fill(#73C1C1);

    beginShape(TRIANGLES);
    vertex(A.x, A.y, A.z);
    vertex(B.x, B.y, B.z);
    vertex(C.x, C.y, C.z);
    endShape();

    fill(255);
    text("AX="+A.x, 10, 20);
    text("AY="+A.y, 10, 40);
    text("AZ="+A.z, 10, 60);

    text("BX="+B.x, 10, 100);
    text("BY="+B.y, 10, 120);
    text("BZ="+B.z, 10, 140);

    text("CX="+B.x, 10, 180);
    text("CY="+B.y, 10, 200);
    text("CZ="+B.z, 10, 220);

    text(locX, 10, 260);
    text(locY, 10, 280);
  }
}

I’m trying to make a simple shape tool for a program. It works by adding a vertex to a shape when the mouse is clicked.

//array to hold points
var mousepoints = [];



function setup() {
    createCanvas(400,400);
    background(200);
}

function draw() {
 print(mousepoints);   
    fill(20,200,66);
    beginShape();
    for(var i=0; i <mousepoints.length; i = i + 2){
    vertex(mousepoints[i], mousepoints[i+1]);
    }


    endShape();
}

function mouseClicked(){

    append(mousepoints, mouseX);
    append(mousepoints, mouseY);    

}


function keyTyped(){

    //start a new shape

    if(key ==='a'){
    mousepoints.splice(0, mousepoints.length);
    }  
}

The issue i’m facing is that when I make my shape with extrusions such as in the image, there is a fill outside the shape thats appearing(I have marked it in the red circles). Any way to resolve this?

I want the program to start with the yellow star in the middle and then when you press and hold down the mouse button it should begin bouncing around the screen while constantly changing colors? upon mouseReleased the star resets back to the middle. I'm pretty new to processing so I can't see where I'm going wrong.

When I take the bounce code out of the mousePressed method and place it in draw, the star just goes from the top left corner to the botom right and changes color upon each mouseclick any advice would be highly appreciated!

PImage blob;
void setup() {
  size(800,800,P2D);
  blob = loadImage("ASD.jpg");
}
void draw() {
  background(255);
  beginShape(QUADS);
  texture(blob);
  noStroke();
  vertex(100,100,0,0);
  vertex(100,200,0,1);
  vertex(200,200,1,1);
  vertex(200,100,1,0);
  endShape();
}

If someone can explain to me what the 0s and 1s mean as the 3rd and 4th arguments in the vertexes of a beginShape(QUADS) function, that would be awesome!

can anyone tell me if it is posibel or do i need to create an image and then use beginShape with image as texture. it just seems power consuming like that.

I modified the code such that it retrieves the number of moons and the appropriate image file from a .csv, and managed to get it working.

However, I have trouble embedding it to a html file. Below are the contents of the html and processing code. I also attached an image of the working directory.

Any pointers on what's going wrong is greatly appreciated. (I have a feeling it has something to do with the *@pjs preload command of the .pde ..., but not sure)

Many thanks in advance.

-----html code--------

<html>
<head>
<title> My first webpage</title>
<script src="Processing.js"></script>
</head>

<body>
Hello World!
<marquee> this is a test!</marquee>
<canvas data-processing-sources="solargenerator_sunrotate_ver6.pde planet.pde"></canvas>
</body>
</html>

-----sketch code solargenerator_sunrotate_ver6--------

import peasy.*;
Planet[] sun;


PeasyCam cam;

PImage sunTexture;
PImage[] textures = new PImage[3];
Table holidaytable;
int nrows;

void setup() {
  size(900, 700, P3D);

  Table holidaytable=loadTable("test.csv", "header");

  textures[0] = loadImage("earth.jpg");
  textures[1] = loadImage("cmb.jpg");
  textures[2] = loadImage("sky.jpg");

  cam = new PeasyCam(this, 1000);

  int nrows =holidaytable.getRowCount(); 

  sun = new Planet[nrows];


  for (int i = 0; i < nrows; i++) {
    TableRow row = holidaytable.getRow(i);

    int ID = row.getInt("no");
    int holiday = row.getInt("holidays");
    String picture = row.getString("image");

    sunTexture= loadImage(picture);

    sun[i]= new Planet(50, 450, 0, true, ID, sunTexture);
    sun[i].spawnMoons(holiday,1); 
  }  
}

void draw() {
  background(0);
  lights();

  for (Planet sun2 : sun) {
    sun2.show();
    sun2.orbit();
  }
}

OS: windows 10 Processing version: 3.3.4

function setup() { createCanvas(windowWidth, windowHeight); background(0); blendMode(ADD); noFill(); stroke(255, 64, 8, 128); }

function draw() { translate(width * 0.5, height * 0.5);

if (s < 2000) { // Create a series of perlin rings from big to small for (var nTimes = 0; nTimes < 10; nTimes++) {

  // Less points for smaller rings
  nPoints = int(2 * PI * s);
  nPoints = min(nPoints, 500);

  // Create ring
  beginShape();
  for (var i = 0; i < nPoints; i++) {
    var a = i / nPoints * TAU;
    var p = p5.Vector.fromAngle(i / nPoints * TAU);
    var n = noise(xOffset + p.x * inc, yOffset + p.y * inc) * s;
    p.mult(n);
    vertex(p.x, p.y);
  }
  endShape(CLOSE);

  // Increment perlin offset for next ring
  xOffset += offsetInc;
  yOffset += offsetInc;

  // Reduce size for next ring
  s *= m;
}

} else { noLoop(); } }

/* @pjs preload="ToxicTots.jpg","spine.jpg","top.jpg", "bottom.jpg"; */

PImage tex1; PImage tex2; PImage tex3; PImage tex4;

float rotx = PI/4; float roty = PI/4;

void setup() { size(800, 900, P3D); tex1 = loadImage("ToxicTots.jpg"); tex2 = loadImage("spine.jpg");
tex3 = loadImage("top.jpg");
tex4 = loadImage("bottom.jpg"); textureMode(NORMAL); fill(255); stroke(color(44,48,32)); }

void draw() { background(176,224,230); noStroke(); translate(width/2.0, height/3.0, -100); rotateX(rotx); rotateY(roty); scale(200); TexturedCube(tex1);
TexturedCube(tex2);
TexturedCube(tex3); TexturedCube(tex4); }

void TexturedCube(PImage tex) { beginShape(QUADS);

// +Z "front" face texture(tex1); vertex(-.25, -1, 1, 0, 0); vertex( 1, -1, 1, 1, 0); vertex( 1, 1, 1, 1, 1); vertex(-.25, 1, 1, 0, 1);

// -Z "back" face texture(tex1); vertex( 1, -1, .75, 0, 0); vertex(-.25, -1, .75, 1, 0); vertex(-.25, 1, .75, 1, 1); vertex( 1, 1, .75, 0, 1); endShape();

// +Y "bottom" face
beginShape(QUADS); texture(tex3); vertex(-.25, 1, 1, 0, 0); vertex( 1, 1, 1, 1, 0); vertex( 1, 1, .75, 1, 1); vertex(-.25, 1, .75, 0, 1); endShape();

// -Y "top" face beginShape(QUADS);
texture(tex4); vertex(-.25, -1, 1, 0, 0); vertex( 1, -1, 1, 1, 0); vertex( 1, -1, .75, 1, 1); vertex(-.25, -1, .75, 0, 1); endShape();

// +X "right" face beginShape(QUADS); texture(tex2); vertex( 1, -1, 1, 0, 0); vertex( 1, -1, .75, 1, 0); vertex( 1, 1, .75, 1, 1); vertex( 1, 1, 1, 0, 1);

// -X "left" face vertex(-.25, -1, 1, 0, 0); vertex(-.25, -1, .75, 1, 0); vertex(-.25, 1, .75, 1, 1); vertex(-.25, 1, 1, 0, 1); endShape(); }

void mouseDragged() { float rate = 0.01; rotx += (pmouseY-mouseY) * rate; roty += (mouseX-pmouseX) * rate; }

function setup() {
    createCanvas(
        window.innerWidth,
        window.innerHeight
    );
}

function draw() {
    background(0);
    ship(0, 0);
 }

function ship(x, y) {
    noFill();
    stroke(0, 255, 0);
    beginShape();
    vertex(200, 10);
    vertex(195, 10);
    vertex(195, 25);
    vertex(180, 25);
    vertex(180, 50);
    vertex(130, 50);
    vertex(130, 60);
    vertex(120, 60);
    vertex(120, 90); 
    vertex(280, 90);
    vertex(280, 60);
    vertex(270, 60);
    vertex(270, 50);
    vertex(220, 50);
    vertex(220, 25);
    vertex(205, 25);
    vertex(205, 10);
    vertex(200, 10)
    endShape();
}

void setup() { size(128, 128, OPENGL); background(128); noStroke(); beginShape(); fill(0); vertex(30, 20); vertex(85, 20); fill(0,255,0); vertex(85, 75); vertex(30, 75); endShape(); }

Excuse my very poor English.

I am a very beginner.

I would like to be guided please.

My project :
1. I have a picture for example 1200/1200 pixels.
2. At any point in the picture, I click with the mouse to have a point "c".
3. This point "c" becomes the center of 5 concentric rings.
4. I would like to turn the rings a few degrees clockwise or counter-clockwise.

I have no idea that the pixels of the original photo become the pixels of my rings.

It would be nice of me to orient myself.

Thank you

What i want to do is this but in movement....

Here's an example sketch: http://www.nr37.nl/0/p5js

Also when I use noStroke(), fill(255,0,0) and then draw the vertices the shape is red (right shape in example), the left shape in the example is preceded by noFill(), stroke(0) but the shaped is still stroked red...

I can't figure out why it is not working. I've put a println() to check if the values retrieved in each iteration are ok. The values are ok, but vertex does not draw the polygon. I've also tried leaving the image (svg) out, because perhaps, the loop draws it behind the map, but again, no success. Maybe the endShape should not be outside the second loop, meaning that all code between beginShape and endShape must remain together? Any idea? Thanks so much in advance, Marcelo

This is the program (Processing 2):

PShape mapaBA;
Table table;

void setup(){
  size(800,800);
  noLoop();
  table = loadTable("barrios.csv"); // coords for some neighborhoods limits
  mapaBA = loadShape("CABA.svg"); // map of Buenos Aires city
}

void draw(){
    shape(mapaBA,0,0,width,height);
    for (int i=0;i<table.getRowCount();i++){ 
      for (int e =0;e<table.getColumnCount()-1;e=e+2){ 
          beginShape();
          int x = table.getInt(i,e);
          int y = table.getInt(i,e+1);
          println(i, e, x,y); // just to test if values are ok
          vertex(x,y); // should draw a polygon that delimites a neighbourhood, based on coords
        }
          endShape(CLOSE);
    }

}

The csv file contains the following values:

642,320,554,326,564,365,643,355
647,355,563,364,561,401,648,393
559,403,612,400,617,438,567,468
649,394,612,398,618,440,659,431

pushMatrix(); // only adjusts translate/scale within matrix translate(width/2, height/2); // suggestion to draw from center out scale(.65); xrect(0,0,250,250); popMatrix();

void xrect(float x1, float y1, float w1, float h1) { rect(x1, y1, w1, h1); String shape = "rect"; float x1out = map(screenX(x1, y1), 0, width, 0, 1); float y1out = map(screenY(x1, y1), 0, height, 0, 1); float w1out = map(w1, 0, width, 0, 1); float h1out = map(h1, 0, height, 0, 1); // .. OSC message w/ these values sent after this }

perhaps i should just be grabbing the screenX of (x1+w1) to know where that xpoint is then check the distance between those points? Wondering if there's a better way to check for transformations and know if anything's being scaled.

Lets use the popular star shape as an example code. Any irregular shape is of interest.

How can I use stroke() so that the stroke is only applied to the inner edge? Or only the outer edge? See picture.

This is a popular tool when using vectors in Illustrator or Photoshop so I thought I might have a chance at communicating this and illustrating the desired outcome.

Thanks for any tips!

// How to make it so stroke is only drawn on one side of edge?

void draw() {
  background(51);
  translate(mouseX, mouseY);
  fill(102);
  stroke(255);
  strokeWeight(2);
  beginShape();
  vertex(0, -50);
  vertex(14, -20);
  vertex(47, -15);
  vertex(23, 7);
  vertex(29, 40);
  vertex(0, 25);
  vertex(-29, 40);
  vertex(-23, 7);
  vertex(-47, -15);
  vertex(-14, -20);
  endShape(CLOSE);
}

Photo Link

This is the working code:

//Array for Temperature
float[] airTempMax;
float[] airTempMin;

Table table;
int rowCount;

//coordinates for circles
float x = 40;
float y = 40;


void setup() {
  background(230);
  size(1100, 1100);
  smooth();
  noFill();
  strokeWeight(1.2);
  ellipseMode(CENTER);
  colorMode(HSB, 60);
  initializeMaxTemp();
  initializeMinTemp();
  println(airTempMin);

  noLoop();
}

void initializeMaxTemp() {

  //load the csv
  table = loadTable("Wetter_Potsdam.csv", "header");

  //count the rows
  rowCount = table.getRowCount();

  //length of array (-1 because last row is empty)
  airTempMax = new float[rowCount-1];

  // Array airTempMax is filled up here
  for (int i = 0; i < airTempMax.length; i++) {
    airTempMax[i] = table.getFloat(i, 9);
  }
}

void initializeMinTemp() {

  //load the csv
  table = loadTable("Wetter_Potsdam.csv", "header");

  //count the rows
  rowCount = table.getRowCount();

  //length of array (-1 because last row is empty)
  airTempMin = new float[rowCount-1];

  // Array airTempMax is filled up here
  for (int k = 0; k < airTempMin.length; k++) {
    airTempMin[k] = table.getFloat(k, 10);
  }
}


// here the tempurate is drawn and every day got its own color depending on temperature
void temperature() {

  for (int j = 0; j < airTempMax.length; j++) {

    //color of each stroke
    stroke(airTempMin[j]+40, 100, 100);

    // every single line got rotated by one unit, all units equal 360 (deegree)
    rotate(radians(360.0/365));
    strokeWeight(0.2);
    line((airTempMin[j]*4)+150, 0, (airTempMax[j]*4)+150, 0);
    noStroke();
    fill(airTempMin[j]+40, 100, 100);
    ellipse((airTempMax[j]*4)+150,0,3,3);
    ellipse((airTempMin[j]*4)+150,0,3,3);
  }
}

void draw() {

  //we need translate here in order to have a visual anchor to read this diagram
  translate(width/2, height/2);

  // here the whole circle is rotate by 240 deegree
  rotate(radians(240));
  
  strokeWeight(1);
  temperature();
}

What I tried so far but stuck is to draw the line with vertex, but it doesnt work like I want it to.

int radius = 200;
float[] airTempMax;

Table table;
int rowCount;

void setup(){
  size(500,500);
  noFill();
  noLoop();
  initializeMaxTemp();
  println(airTempMax);
}

void initializeMaxTemp() {

  //load the csv
  table = loadTable("Wetter_Potsdam.csv", "header");

  //count the rows
  rowCount = table.getRowCount();

  //length of array (-1 because last row is empty)
  airTempMax = new float[rowCount-1];

  // Array airTempMax is filled up here
  for (int i = 0; i < airTempMax.length; i++) {
    airTempMax[i] = table.getFloat(i, 9);
  }
}

void draw(){
  translate(width/2,height/2);
  background(204);
  beginShape();
  for(int deg = 0; deg < 365; deg++){
    float angle = radians(deg);
    float x = airTempMax[deg] + (cos(angle) * radius);
    float y = 5 + (sin(angle) * radius);
    vertex(x,y);
  }
  endShape();
}

If you have any ideas to solve this problem please let me know. Thank you!!

I'm trying to create a box where every face is subdivided into small triangular faces. I tried to use the beginShape() function to create all the triangles but I cannot find a good way of organizing the vertices position.

Can anyone give me any suggestion? thanks, J_D

#
# A fatal error has been detected by the Java Runtime Environment:
#
#  EXCEPTION_ACCESS_VIOLATION (0xc0000005) at pc=0x0000000069277ea6, pid=5844, tid=15192
#
# JRE version: Java(TM) SE Runtime Environment (8.0_51-b16) (build 1.8.0_51-b16)
# Java VM: Java HotSpot(TM) 64-Bit Server VM (25.51-b03 mixed mode windows-amd64 compressed oops)
# Problematic frame:
# C  [dcpr.dll+0x7ea6]
#
# Failed to write core dump. Minidumps are not enabled by default on client versions of Windows
#
# An error report file with more information is saved as:
# C:\Program Files (x86)\processing-3.0.1\hs_err_pid5844.log
#
# If you would like to submit a bug report, please visit:
#   http://bugreport.java.com/bugreport/crash.jsp
# The crash happened outside the Java Virtual Machine in native code.
# See problematic frame for where to report the bug

This is the sketch i'm running:

int TriangleNo = 5;
int gridSize = 3;

Triangle[] newTriangle = new Triangle[TriangleNo];

void setup() {
  size(700, 700);
  smooth();
  noStroke();
  colorMode(HSB, 100);

  for (int n = 0; n < newTriangle.length; n++) {
    newTriangle[n] = new Triangle();

    // get the first set of Triangles
    //newTriangle[n].display();
  }
}

void draw() {
  background(0, 0, 95);

  float grid = floor(width/gridSize);

  for (int i = 0; i < gridSize; i++) {
    for (int j = 0; j < gridSize; j++) {

      pushMatrix();
      translate(i*grid, j*grid);
      for (int n = 0; n < newTriangle.length; n++) {
        newTriangle[n].display();
      }
      popMatrix();

    } // end j
  } // end i
}


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


class Triangle {
  float x1, y1, x2, y2, x3, y3;
  float xx1, yy1, xx2, yy2, xx3, yy3;
  float upSizeFactor = 100;
  color cF;

  Triangle() {
  }

  void display() {
    if (frameCount % 100 == 0) {
      getFill();
      getNumbers();
    }
    updateTriangle();
    drawTriangle(cF);
  }

  void updateTriangle() {
    x1 = lerp(x1, xx1, 0.15);
    y1 = lerp(y1, yy1, 0.15);
    x2 = lerp(x2, xx2, 0.15);
    y2 = lerp(y2, yy2, 0.15);
    x3 = lerp(x3, xx3, 0.15);
    y3 = lerp(y3, yy3, 0.15);
  }

  void getNumbers() {
    x1 = floor((random(3) - 1)) * upSizeFactor;
    y1 = floor((random(3) - 1)) * upSizeFactor;
    x2 = floor((random(3) - 1)) * upSizeFactor;
    y2 = floor((random(3) - 1)) * upSizeFactor;
    x3 = floor((random(3) - 1)) * upSizeFactor;
    y3 = floor((random(3) - 1)) * upSizeFactor;

    x1 = xx1;
    y1 = yy1;
    x2 = xx2;
    y2 = yy2;
    x3 = xx3;
    y3 = yy3;

    xx1 = floor((random(3) - 1)) * upSizeFactor;
    yy1 = floor((random(3) - 1)) * upSizeFactor;
    xx2 = floor((random(3) - 1)) * upSizeFactor;
    yy2 = floor((random(3) - 1)) * upSizeFactor;
    xx3 = floor((random(3) - 1)) * upSizeFactor;
    yy3 = floor((random(3) - 1)) * upSizeFactor;
  }

  void drawTriangle(color cF_) {
    beginShape();
    fill(cF_);
    vertex(x1, y1);
    vertex(x2, y2);
    vertex(x3, y3);
    endShape();
  }

  color getFill() {
    cF = color(random(100), 100, 95, 90);
    return cF;
  }
}

Here's the full log: http://pastebin.com/JbsYyNwz

Anyone knows why this is happening?

#version 410

uniform mat4 transform;

in vec4 vertex;
in vec2 texCoord;

out vec2 vertTexCoord;

void main() {

    vertTexCoord = vec2(texCoord.x, 1.0 - texCoord.y);
    gl_Position = transform * vertex;
}

// ----

#version 410


uniform sampler2D texture;

in vec2 vertTexCoord;

out vec4 fragColor;

void main() {
    fragColor = texture(texture, vertTexCoord);
}

import processing.opengl.*;
   Pyramid[] piramide;
   float[] n= new float [150];
   float[] m= new float [150];

void setup() {
  piramide = new Pyramid[150];
  size(900, 600, OPENGL);
for (int i=0; i<piramide.length;i++) {
  n[i]=random(width);
  m[i]=random(height);
    piramide[i] = new Pyramid(n[i], m[i], random(20), random(5,15),(random(5,30)*0.001));

}
}

void draw() {
  smooth();
  lights();
  background(30,25,30);
for (int i=0; i<piramide.length;i++) {
    Pyramid thisPyr = piramide[i];
    thisPyr.collision_det();
    thisPyr.rotacion();
  }
}


class Pyramid {
  float x, y, z, t, s;
  float theta=0.0;
  float alph;

  Pyramid(float tempX, float tempY, float tempZ, float tempT, float tempS) {
    x= tempX;
    y= tempY;
    z= tempZ;
    t= tempT;
    s= tempS;
  }

  void drawPiramide() {
    pushMatrix();

    translate(x, y);

    beginShape(TRIANGLES);
    noStroke();


   fill(220,220,220);
   vertex(0, t*2, 0); 
   vertex(0, 0, -t);
   vertex(-t, 0, 0);

   fill(250,250,250);
   vertex(0, t*2, 0);
   vertex(0, 0, -t);
   vertex(t, 0, 0);

   fill(220,220,220);
   vertex(0, t*2, 0);
   vertex(t, 0, 0);
   vertex(0, 0, t);

   fill(250,250,250);
   vertex(0, t*2, 0);
   vertex(0, 0, t);
   vertex(-t, 0, 0);

   fill(250,250,250);
   vertex(0, -t*2, 0);
   vertex(0, 0, -t);
   vertex(-t, 0, 0);

   fill(220,220,220);
   vertex(0, -t*2, 0);
   vertex(0, 0, -t);
   vertex(t, 0, 0);


   fill(250,250,250);
   vertex(0, -t*2, 0);
   vertex(t, 0, 0);
   vertex(0, 0, t);

   fill(220,220,220);
   vertex(0, -t*2, 0);
   vertex(0, 0, t);
   vertex(-t, 0, 0);

    rotateY(theta); 

    endShape();

    popMatrix();
  }

  void rotacion() { 
    theta+=0.002+s;
  }


  void collision_det() {
     boolean touching = false;


for (int i=0; i<piramide.length;i++) {
Pyramid thisPyr = piramide[i];
for (int k=1; k<piramide.length; k++)
{
Pyramid otherPyr = piramide[k];
float dis = dist(thisPyr.x, thisPyr.y, otherPyr.x, otherPyr.y);
if ((dis - 0.1) < t*4) {
touching = true;
break;
}

if (touching == false) {
piramide[i].drawPiramide();
 }
 }
  }
}

}

I tried with the map function, but I feel the same. */

float p=0; // angle 1 float d=180; // ange 2 float w=180; // angle 3 float topRadius=10; float bottomRadius=10; float tall=100; float sides=100; float cpx, cpy,angle = 0,angle1,angle2; int e; float rx = 0; float ry =0; int gridSize=40; float angulo=0; void setup() { size(1080, 660, P3D); } void draw() { background(0); fill(255, 255, 255);

lights(); translate(width / 2, height / 2,0);

fill(255,0,0); sphere(15);

 noStroke();

fill(255, 255, 255); translate(0, 0, 0); angle = radians(p) ; beginShape(QUAD_STRIP); for (int i = 0; i < sides + 1; ++i) { vertex(topRadiuscos(angle), 0, topRadiussin(angle)); vertex(bottomRadiuscos(angle), tall0.8,bottomRadiussin(angle)); angle += TWO_PI / sides; rotateX(angle); } endShape(); translate(0,tall0.8,0); fill(255,0,0); sphere(15); fill(255, 255, 255); angle1 = radians(d); beginShape(QUAD_STRIP); for (int i = 0; i < sides + 1; ++i) {
vertex(topRadiuscos(angle1), 0, topRadiussin(angle1)); vertex(bottomRadiuscos(angle1), tall0.6,bottomRadius*sin(angle1)); angle1 += TWO_PI / sides; rotateX(angle1); } endShape();

translate(0,tall0.6,0); fill(255,0,0); sphere(13); fill(255, 255, 255); angle2 = radians(w); beginShape(QUAD_STRIP); for (int i = 0; i < sides + 1; ++i) {
vertex(topRadiuscos(angle2), 0, topRadiussin(angle2)); vertex(bottomRadiuscos(angle2), tall0.5,bottomRadiussin(angle2)); angle2 += TWO_PI / sides; rotateX(angle2); } endShape(); translate(0,tall*0.5,0); fill(255,0,0); sphere(10); println(angle, angle1, angle2); }

void setup()
{
  size(400,400,P2D);
  stroke(0);
  line(width/2,0,width/2,height);
  line(0,height/2,width,height/2);

  noStroke();
  drawSquare(width/2,height/2,100,"wood1.jpg",1000);
}

void drawSquare(float centerX, 
                float centerY,  
                float squareSize, 
                String textureName, 
                float textureSize) {
  PImage img = loadImage(textureName);
  PShape s = createShape();
  s.beginShape();
  s.texture(img);

  s.vertex(centerX-squareSize/2, centerY-squareSize/2, 0, 0);
  s.vertex(centerX+squareSize/2, centerY-squareSize/2, textureSize, 0);
  s.vertex(centerX+squareSize/2, centerY+squareSize/2, textureSize, textureSize);
  s.vertex(centerX-squareSize/2, centerY+squareSize/2, 0, textureSize);
  s.endShape();
  s.translate(-centerX,-centerY);
  s.rotate(radians(45));
  s.translate(centerX,centerY);
  shape(s);
}

For random point cloud generated in realtime, what data structure in Processing is appropriate for its rendering? I tried with PShape, but only got 10~15 FPS for 20,000 points.

PShape boxCloud;

void setup() {
  size(400, 400, P3D);
  smooth();
}

void draw() {
  background(0);
  translate(width/2, height/2);
  gen();
  shape(boxCloud);
}

void gen()
{
  boxCloud = createShape();
  boxCloud.beginShape(POINTS);
  boxCloud.stroke(255);
  for (int i = 0; i < 20000; i++) {
    boxCloud.vertex(random(-50, 50), random(-50, 50), random(-50, 50));
  }
  boxCloud.endShape();
}

I've test ofMesh in openFrameworks, it can run at almost 60 FPS rendering 200,000 points. Is it possible to do that in Processing?

I am working on a graphic and tried to add a structure, what is not working. Does anybody has an advice for me? Thanks a lot.

Markus

import ddf.minim.*; import processing.pdf.*; PImage img;

boolean record;

Minim minim; AudioInput input;

void setup() {

size(displayWidth, displayHeight, P3D); minim = new Minim (this); input = minim.getLineIn (Minim.STEREO, 512); noCursor(); img = loadImage("bild.jpg"); }

void draw() {

if(record){ beginRaw(PDF, "output.pdf"); }

float dim = input.mix.level () * width; translate(width/2, height/2, 0);

pushMatrix(); scale(0.9);

rotateX(PI/2); rotateZ(-PI/10);

beginShape(); texture(img); background(19,19,19);

smooth();

//stroke(255,175,0); stroke(255); strokeWeight(1.8);

scale(0.9); smooth();

rotateX(frameCount/700.0); rotateY(frameCount/600.0); rotateZ(frameCount/200.0);

curveVertex( mouseX, 320, -120); curveVertex(-250, -dim, -mouseX); curveVertex( -mouseY, -190, mouseX);

curveVertex(-260, -dim, mouseX); curveVertex(-dim, -190, -210); curveVertex( mouseX, -mouseY, dim);

curveVertex(-160, -mouseX, -290); curveVertex(-dim, dim, -210); curveVertex( 100, 140, dim);

curveVertex(-mouseY, mouseX, -390); curveVertex(-dim, dim, -210); curveVertex( mouseY, 240, dim);

curveVertex( 120, -220, mouseX); curveVertex( 290, dim, dim); curveVertex( dim, dim, mouseY);

fill(255);

curveVertex(mouseX, 220, -150); curveVertex(-dim, 110, dim); curveVertex( -mouseY, -150, mouseY);

curveVertex( mouseX, 220, -dim); curveVertex(-350, -dim, -220); curveVertex( mouseX, 210, -mouseX);

curveVertex(mouseX, dim, -200); curveVertex(-110, dim, mouseY); curveVertex( 230, dim, -mouseY);

curveVertex(340, dim, -325); curveVertex(mouseY, dim, -135); curveVertex( -dim, -mouseY, mouseY); endShape(); popMatrix();

pushMatrix(); fill(19,19,19); noStroke(); rectMode(CENTER); //rect(0,0,500,500); popMatrix();

if (record) { endRaw(); record = false; }

endShape(CLOSE);

}

//boolean sketchFullScreen() { //return true; //}

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

beginShape();
for(int i = 0; i <= 360; i += 30) {
   curveVertex(pos.x + sin(radians(i))*r, pos.y + cos(radians(i))*r);
}
endShape();