Processing to p5.js sketch

Hi all,

I’m pretty new to coding and I’m trying to convert a processing file to a p5.js file but it keeps giving me an error. I know there’s something wrong wrong about the PVector but not sure what.

Can somebody help me out?

This is the p5.js file now<<<<<

var points;
var d;

function setup() {
initializeFields();
createCanvas(600, 800);
for (var i = 0; i < points.length; i++) {
points[i] = new PVector(random(width), random(height), random(width));
}
}

function draw() {
loadPixels();
for (var x = 0; x < width; x++) {
for (var y = 0; y < height; y++) {
var distances = new Array(points.length);
for (var i = 0; i < points.length; i++) {
var v = points[i];
var z = frameCount % height;
var d = dist(x, y, z, v.x, v.y, v.z);
distances[i] = d;
}
var sorted = sort(distances);
var r = map(sorted[0], 10, 150, 0, 185);
var g = map(sorted[1], 220, 50, 255, 110);
var b = map(sorted[2], 0, 200, 255, 10);
var index = x + y * width;
pixels[index] = color(r, g, b);
}
}
updatePixels();
}

function initializeFields() {
points = new Array(100);
d = “hello”;
}

and this was the origin <<<<<

PVector points = new PVector[100];
String d = “hello”;

void setup() {
size(600, 800);
for (int i = 0; i < points.length; i++) {
points[i] = new PVector(random(width), random(height), random(width));
}
}

void draw() {
loadPixels();
for (int x = 0; x < width; x++) {
for (int y = 0; y < height; y++) {

  float[] distances = new float[points.length];
  for (int i = 0; i < points.length; i++) {
    PVector v = points[i];
    float z = frameCount % height;
    float d = dist(x, y, z, v.x, v.y, v.z);
    distances[i] = d;
  }
  float[] sorted = sort(distances);
  float r = map(sorted[0], 10, 150, 0, 185);
  float g = map(sorted[1], 220, 50, 255, 110);
  float b = map(sorted[2], 0, 200, 255, 10);
  int index = x + y * width;
  pixels[index] = color(r, g, b);
}

}
updatePixels();

}

Many thanks!!

Hi,

Welcome to the forum! :slight_smile:

Remember to format your code by using the </> button in the message editor on the forum.

You are right, the PVector class is in Processing Java not in p5.js, the equivalent is :

1 Like