VM20:145 Uncaught TypeError: circle.bind is not a function at eval (eval at attach (processing.js:872), :145:17) at Processing.Sketch.attach (processing.js:873) at executeSketch (processing.js:21501) at new Processing.Processing (processing.js:21535) at callback (processing.js:950) at XMLHttpRequest.xhr.onreadystatechange (processing.js:929)

VM20:29 Uncaught ReferenceError: createShape is not defined at Processing.Processing.setup (eval at attach (processing.js:872), :29:9) at executeSketch (processing.js:21508) at new Processing.Processing (processing.js:21535) at callback (processing.js:950) at XMLHttpRequest.xhr.onreadystatechange (processing.js:929)

I had to download the JavaScriptMode from an online source so I am not sure if it will work, but it seems to handle simple sketches just fine. Is it having problems with 2D arrays? or something else I am unaware of.

The code for one of the sketches not working is below:

` PImage logo;

// Three possible shapes
PShape[] shapes = new PShape[4]; //Pshape array
int shapesize = 100; //shape sizes
int cols = 5;
int rows = 5;
int[][] shapeNumbers;

color[][] colors; //2D color array
color[] colorsb = 
{ 
#F71F02, //red
#13C081, //green
#5BC0EB, //blue
#FDE74C, //yellow
#133C55,
//#FF00FF, //pink
//#FF8000, //orange
};




void setup() {
  size(1920, 1080, P2D);
  ellipseMode(CENTER);
 rectMode(CENTER);
 logo = loadImage("thesis_logo.png");
  shapes[0] = createShape(ELLIPSE,shapesize,shapesize,shapesize,shapesize);
  //shapes[0].setFill(color(255,0,0));
  //shapes[0].setStroke(255);
  shapes[1] = createShape(RECT,shapesize,shapesize,shapesize,shapesize);
  //shapes[1].setFill(color(0));
  //shapes[1].setStroke(255);
  shapeMode(CENTER);
  shapes[2] = createShape();  
  shapes[2].beginShape();
 //shapes[2].fill(0); //fill squares
 // shapes[2].setStroke(255);
   shapes[2].vertex(-14+shapesize, -20+shapesize);
   shapes[2].vertex(-47+shapesize, -15+shapesize);
   shapes[2].vertex(-23+shapesize, 7+shapesize);
   shapes[2].vertex(-29+shapesize, 40+shapesize);
   shapes[2].vertex(0+shapesize, 25+shapesize);
    shapes[2].vertex(29+shapesize, 40+shapesize);
    shapes[2].vertex(23+shapesize, 7+shapesize);
    shapes[2].vertex(47+shapesize, -15+shapesize);
     shapes[2].vertex(14+shapesize, -20+shapesize);
  shapes[2].vertex(0+shapesize, -50+shapesize);
  shapes[2].endShape(CLOSE);

   shapes[3] = createShape(TRIANGLE,30, 75, 58, 20, 86, 75);  


shapeNumbers = new int[rows][cols];
 colors();
mix();
}




void draw() {
  background(255);
 shapes(150,150);
  image(logo, 50, 50, width/8, height/8);



 if (keyPressed) {
      if(key==ENTER){
       mix();
       colors();
      }
    }
}

void shapes(int posx, int posy){
 pushMatrix();
  translate(width/3,200);
 for (int i=0; i<cols; i++) {
    for (int j=0; j<rows; j++) {

      int shapeIndex = shapeNumbers[i][j];
PShape currentShape = shapes[shapeIndex];
     currentShape.setFill(colors[i][j]);
     currentShape.setStroke(false);
    shape(currentShape,i*posx,j*posy,shapesize,shapesize);

    if (mousePressed ==true){
      int x = i*posx+width/3;
      int y = j*posy+200;
     if (mouseX > x && mouseX < (x + shapesize) && mouseY > y && mouseY < (y + shapesize)){
      colors[i][j]=color(255);
    }
    }
    }
  }
    popMatrix();
}

void mix(){
 for (int i=0; i<cols; i++) {
    for (int j=0; j<rows; j++) {

    shapeNumbers[i][j] = int(random(shapes.length));

    }}
}

void colors(){
  colors = new color[cols][rows];
  for (int i=0; i<cols; i++) {
    for (int j=0; j<rows; j++) {
      int rand = (int)random(colorsb.length); //choose a random value in array
      colors[i][j] = color(colorsb[rand]); //random color from array
    }
  }
}`

void shapes(int posx, int posy)
{
 pushMatrix();
translate(width/3,200);
 for (int i=0; i<cols; i++) {
    for (int j=0; j<rows; j++) {

      int shapeIndex = shapeNumbers[i][j];
      PShape currentShape = shapes[shapeIndex];
     currentShape.setFill(colors[i][j]);
     currentShape.setStroke(false);
     shape(currentShape,i*posx,j*posy,shapesize,shapesize);

    if (mousePressed ==true){
    int  x = i*posx+width/3;
     int y = j*posy+200;
     if (mouseX > x && mouseX < (x + shapesize) && mouseY > y && mouseY < (y + shapesize)){
      colors[i][j]=color(255);
    }
    }
    }
  }
    popMatrix();
}

void shapes(int posx, int posy){
 pushMatrix();
  translate(width/3,200);
 for (int i=0; i<cols; i++) {
    for (int j=0; j<rows; j++) {

      int shapeIndex = shapeNumbers[i][j];
PShape currentShape = shapes[shapeIndex];
     currentShape.setFill(colors[i][j]);
     currentShape.setStroke(false);
    shape(currentShape,i*posx,j*posy,shapesize,shapesize);

    if (mousePressed ==true){
    int  x = i*posx+width/3;
     int y = j*posy+200;
     if (mouseX > x && mouseX < (x + shapesize) && mouseY > y && mouseY < (y + shapesize)){
      colors[i][j]=color(255);
    }
    }
    }
  }
    popMatrix();
}

Is there a way to make this work ?

Thanks.

(Formatted code below)

import peasy.*;
import peasy.org.apache.commons.math.*;
import peasy.org.apache.commons.math.geometry.*;

PeasyCam cam;

void setup(){
  size(600,600, P3D);
  cam = new PeasyCam(this, 600);
}
void draw(){
  background(255);

  PVector p1 = new PVector(0, 0, 0);
  PVector p2 = new PVector(0, -100, 0);
  PVector p3 = new PVector(-100, -100, 0);
  PVector p4 = new PVector(-100, 0, 0);
  PVector p5 = new PVector(0, 0, -100); 
  PVector p6 = new PVector(0, -100, -100);
  PVector p7 = new PVector(-100, -100, -100);
  PVector p8 = new PVector(-100, 0, -100);

  PShape cube = createShape();
  cube.beginShape();
  cube.vertex(p1.x, p1.y, p1.z);
  cube.vertex(p2.x, p2.y, p2.z);
  cube.vertex(p3.x, p3.y, p3.z);
  cube.vertex(p4.x, p4.y, p4.z);

  cube.vertex(p1.x, p1.y, p1.z);
  cube.vertex(p5.x, p5.y, p5.z);
  cube.vertex(p6.x, p6.y, p6.z);
  cube.vertex(p2.x, p2.y, p2.z);

  cube.vertex(p3.x, p3.y, p3.z);
  cube.vertex(p7.x, p7.y, p7.z);
  cube.vertex(p8.x, p8.y, p8.z);
  cube.vertex(p4.x, p4.y, p4.z);

  cube.vertex(p8.x, p8.y, p8.z);
  cube.vertex(p5.x, p5.y, p5.z);
  cube.vertex(p6.x, p6.y, p6.z);
  cube.vertex(p7.x, p7.y, p7.z);

  cube.vertex(p8.x, p8.y, p8.z);
  cube.vertex(p4.x, p4.y, p4.z);

  cube.endShape(CLOSE);

  cube.setFill(color(100,200,0));
  stroke(100,200,0);
  shape(cube);
}

Tab1:

newEvent.coloring(classColor[0]);

Tab2:

void coloring(String chosen) { classColor = unhex(chosen); }

void draw() { eventColor = createShape(RECT, 0, 0, 40, 40); eventColor.setFill(classColor); eventColor.setStroke(false); }

No matter what obscure type of code I try, I cannot get that rectangle to turn 6ef442. Just... Help. If you know how to improve my ridiculous code or if you know how to get just my stupid rectangle to be the color I want it to be. I appreciate it a ton. Thank

PShape grp, head, head2;

void setup() {
  size(200, 200);
  grp = createShape(GROUP);

  noStroke();

  head = createShape(ELLIPSE, 70, 70, 100, 100);
  head.setFill(color(255, 255, 255, 150));

  head2 = createShape(ELLIPSE, 120, 120, 100, 100);
  head2.setFill(color(255, 255, 255, 150));

  grp.addChild(head2);
  grp.addChild(head);
}

void draw() {
  background(150);
  shape(grp);
}

The result is:

However, what I want is like this:

Researched a bit but had no luck, is there any way to do this? Either Processing or p5.js solution is welcome, I'll be grateful. Thanks.

i'm trying to set the stroke of an imported obj file i'm importing into the drawing with no success. funnily, the setFill() function works just fine.

at the moment, the setStroke() function has no effect on the drawing.

suggestions?

thanks

PShape p;

void setup() {
  size (500, 500, P3D);
  p = loadShape("poly.obj");
  p.setFill(color(150, 0, 0, 100));
  p.setStrokeWeight(10);
  p.setStroke(color(0));
} 

void draw() {
  background(214);
  shape(p, 0, 0);
}

Not sure if I'm using setFill() correctly but I get the error "Array Index out of bounds: 6" when I use it this way:

shape1.setFill(color(255,0,0,226));

I'd appreciate any tips you may have.

Thanks!

void settrans(int trans) { 
  println("Setting TRANSPARENCY to "+trans+" *********************************");
  int braincells = brain.getChildCount();
    for (int cellnum = 0; cellnum < braincells; ++cellnum) {
      tempcell= brain.getChild(cellnum);
      for (int j = 0; j<6; j++) {
        tempface=tempcell.getChild(j);
        //tempface.setFill(quadBG[j]);
        tempface.setTint(trans);
    }}
  shape(brain);}      // Draw the brain

My tracing when I make the calls is : Setting TRANSPARENCY to 255 ********************************* Setting TRANSPARENCY to 88 ********************************* Setting TRANSPARENCY to 255 ********************************* Setting TRANSPARENCY to 88 *********************************