Translating javascript to Processing ---Uint32Array---

p5.js Coding Questions
1

hi guys,

please I need your help translating chi piece of code from P5 to Processing.
I am working on a code and came across this one from this Skitch : QuadTree - OpenProcessing

I am having trouble understanding the this function :this.R = new Uint32Array(256);
and in this case what type of data is it returning? is R an array or what ?

thanx

class Histogram{
	constructor(blob){
		this.img = blob;
		this.img.loadPixels();
		this.px = this.img.pixels;
		
		this.R = new Uint32Array(256);
		this.G = new Uint32Array(256);
		this.B = new Uint32Array(256);
		// this.A = new Uint32Array(256);
		this.total = 0;
		this.varianceR = this.varianceG = this.varianceB = 0;
		this.meanR = this.meanG = this.meanB = 0;
		this.stdDeviation = 0;
		this.error = 0;
		this.area_exponent = 0.25
		this.area_error = Math.pow(blob.width*blob.height, this.area_exponent);

		//histogram
		for(let i=0,v=0;i<this.px.length;i+=4){
			this.R[ this.px[i + 0] ]++; //red
			this.G[ this.px[i + 1] ]++; //green
			this.B[ this.px[i + 2] ]++; //blue
			// this.A[ this.px[i + 3] ]++; //alpha
		}
	}
	rgb(){
		return [this.R, this.G, this.B];
	}
	weightedAvg(){

		let totalR,totalG,totalB;
		let valueR,valueG,valueB;
		totalR = totalG = totalB = 0;
		valueR = valueG = valueB = 0;

		for(let i=0;i < 256;i++){
			totalR += this.R[I];
			totalG += this.G[I];
			totalB += this.B[I];
			//sum weighted 
			valueR += this.R[i] * I;
			valueG += this.G[i] * I;
			valueB += this.B[i] * I;
		}
		//True mean
		this.meanR = totalR / this.R.length;
		this.meanG = totalG / this.G.length;
		this.meanB = totalB / this.B.length;
		
		//what is this?
		valueR /= totalR;
		valueG /= totalG;
		valueB /= totalB;

	// weightedAvg
		for(let i=0;i < 256;i++){
			this.varianceR += sq( valueR - i ) * this.R[I];
			this.varianceG += sq( valueG - i ) * this.G[I];
			this.varianceB += sq( valueB - i ) * this.B[I];
		}
		this.varianceR = Math.sqrt(this.varianceR / totalR);
		this.varianceB = Math.sqrt(this.varianceB / totalB);
		this.varianceG = Math.sqrt(this.varianceG / totalG);
		
		this.total = (totalR + totalG + totalB) / 3;
		this.variance = this.varianceR * 0.2989 + this.varianceG * 0.5870 + this.varianceB * 0.1140;
		this.stdDeviation = Math.sqrt( this.variance );
		this.error = this.stdDeviation * this.area_error;
		
		return [valueR,valueG,valueB, this.error ]; 
	}
}
2

Java’s corresponding container for JS’ Uint32Array would be an int[] array:

Something like this: final int[] R = new int[256];

However pay attention if an int value bigger than MAX_INT is being stored in an int[] container, which in case it would become a negative value:

Inside a Java class keyword this can be generally omitted; unless we have a local variable or parameter which matches (overshadows) the name of a field.

In Java classes we have to define all fields outside the constructor.
So the field R would be declared in a separate declaring block like this:

class Histogram {
  final int[] R = new int[256];

If you need more troubleshooting for the sketch language conversion, just ask again. :smiley:

2 Likes
3

Hi,

Seems not that hard to translate…

As a tipp, as this is maybe not obvious if you’re not that familiar on the java side datatypes …

the rgb function in the end should look like:

  int[][] rgb(){
    return new int[][] {R,G,B};
  }

and the weightedAvg

float[] weightedAvg() {
//...
  return new float[] {valueR,valueG,valueB, error}; 
}

Cheers
— mnse

PS: As @GoToLoop already says

1 Like
4

@GoToLoop and @mnse
thank you guys, i think this will help a lot for the moment !!
I’ll come back to you if I need it !