# P5 convert to Processing problem
**URL:** https://discourse.processing.org/t/p5-convert-to-processing-problem/36018
**Category:** Beginners
**Created:** [March 30, 2022, 7:32am UTC](https://discourse.processing.org/t/p5-convert-to-processing-problem/36018 "2022-03-30T07:32:29Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@AbleYudada](https://discourse.processing.org/u/AbleYudada)
#### Post date: [March 30, 2022, 7:32am UTC](https://discourse.processing.org/t/p5-convert-to-processing-problem/36018/1 "2022-03-30T07:32:29Z")
hello guys!
Recently I am rewriting a p5js code to Processing but there is a strange problem. I have checked that the data is normal, but Processing cannot update the status of the screen in real time. It seems that the status will only change once a second. Can you help me?
p5js code
```auto
// By Roni Kaufman
let kMax; // maximal value for the parameter "k" of the blobs
let step = 0.01; // difference in time between two consecutive blobs
let n = 100; // total number of blobs
let radius = 0; // radius of the base circle
let inter = 0.05; // difference of base radii of two consecutive blobs
let maxNoise = 500; // maximal value for the parameter "noisiness" for the blobs
//let noiseProg = (x) => (x);
function setup() {
createCanvas(windowWidth, windowHeight);
colorMode(HSB, 1);
angleMode(DEGREES);
noFill();
//noLoop();
kMax = random(0.6, 1.0);
noStroke();
}
function draw() {
background(0, 0, 0);
let t = frameCount/100;
for (let i = n; i > 0; i--) {
let alpha = 1 - (i / n);
fill((alpha/5 + 0.75)%1, 1, 1, alpha);
let size = radius + i * inter;
let k = kMax * sqrt(i/n);
//console.log(sqrt(i/n) );
let noisiness = maxNoise * (i / n);
// console.log(t - i * step);
blob(size, width/2, height/2, k, t - i * step, noisiness);
}
}
// Creates and draws a blob
// size is the radius (before noise) of the base circle
// (xCenter, yCenter) is the position of the center of the blob
// k is the tightness of the blob (0 = perfect circle, higher = more spiky)
// t is the time
// noisiness is the magnitude of the noise (i.e. how far it streches out)
function blob(size, xCenter, yCenter, k, t, noisiness) {
beginShape();
//stroke(255,0,0);
let angleStep = 360 / 10;
for (let theta = 0; theta <= 360 + 2 * angleStep; theta += angleStep) {
let r1, r2;
/*
if (theta < PI / 2) {
r1 = cos(theta);
r2 = 1;
} else if (theta < PI) {
r1 = 0;
r2 = sin(theta);
} else if (theta < 3 * PI / 2) {
r1 = sin(theta);
r2 = 0;
} else {
r1 = 1;
r2 = cos(theta);
}
*/
r1 = cos(theta)+1;
r2 = sin(theta)+1; // +1 because it has to be positive for the function noise
console.log(r1,r2);
let r = size + noise(k * r1, k * r2, t) * noisiness;
let x = xCenter + r * cos(theta);
let y = yCenter + r * sin(theta);
curveVertex(x, y);
}
endShape();
}
```
processing code
```auto
// By Roni Kaufman
float kMax; // maximal value for the parameter "k" of the blobs
float step = 0.01; // difference in time between two consecutive blobs
int n = 100; // total number of blobs
float radius = 0; // radius of the base circle
float inter = 0.05; // difference of base radii of two consecutive blobs
float maxNoise = 500; // maximal value for the parameter "noisiness" for the blobs
//let noiseProg = (x) => (x);
void setup() {
size(1000, 1000,P3D);
colorMode(HSB, 1);
//angleMode(DEGREES);
noFill();
//noLoop();
kMax = random(0.6, 1.0);
noStroke();
}
void draw() {
// println(frameRate);
background(0.6, 0.75, 0.25);
int t = frameCount/100;
for (int i = n; i > 0; i--) {
float alpha = 1 - ((float)i/n);
fill((alpha/5 + 0.75)%1, 1, 1, alpha);
float size = radius + (float)i * inter;
float k = kMax * (float)sqrt((float)i/n);
float noisiness = maxNoise * ((float)i / n);
//println( t - i * step);
blob(size, width/2, height/2, k, t - i * step, noisiness);
}
// println(frameCount);
}
// Creates and draws a blob
// size is the radius (before noise) of the base circle
// (xCenter, yCenter) is the position of the center of the blob
// k is the tightness of the blob (0 = perfect circle, higher = more spiky)
// t is the time
// noisiness is the magnitude of the noise (i.e. how far it streches out)
void blob(float size, float xCenter, float yCenter, float k, float t, float noisiness) {
beginShape();
//stroke(255,0,0);
int angleStep = 360 / 10;
for (int theta = 0; theta <= 360 + 2 * angleStep; theta += angleStep) {
float r1, r2;
/*
if (theta < PI / 2) {
r1 = cos(theta);
r2 = 1;
} else if (theta < PI) {
r1 = 0;
r2 = sin(theta);
} else if (theta < 3 * PI / 2) {
r1 = sin(theta);
r2 = 0;
} else {
r1 = 1;
r2 = cos(theta);
}
*/
r1 = cos(degrees(theta))+1;
r2 = sin(degrees(theta))+1; // +1 because it has to be positive for the function noise
float r = size + noise(k * r1, k * r2, t) * noisiness;
float x = xCenter + r * cos(degrees(theta));
float y = yCenter + r * sin(degrees(theta));
curveVertex(x, y);
if(theta ==36)
println(x,y);
}
endShape(CLOSE);
}
```
---
### Author:  [@GoToLoop](https://discourse.processing.org/u/GoToLoop)
#### Post date: [March 30, 2022, 11:04am UTC](https://discourse.processing.org/t/p5-convert-to-processing-problem/36018/2 "2022-03-30T11:04:30Z")
> [@AbleYudada](#):
>
> It seems that the status will only change once a second.
Maybe b/c you’re dividing _frameCount_ by an integer here?
> [@AbleYudada](#):
>
> `int t = frameCount/100;`
In Java if both division’s operands are whole values, the result is also a whole value. The fractional part is removed from the result!
As a workaround, declare variable _t_ as _float_ and place a trailing dot at the number `100`, so it becomes a fractional value, and thus we have a fractional division:
`float t = frameCount/100.;`
---
### Author:  [@AbleYudada](https://discourse.processing.org/u/AbleYudada)
#### Post date: [March 30, 2022, 2:19pm UTC](https://discourse.processing.org/t/p5-convert-to-processing-problem/36018/3 "2022-03-30T14:19:09Z")
thank you very much! These details are a real headache. . .