hello! I am hoping to get someone to look at what I’ve written and help me troubleshoot.
below is a link to the sketch written in the web editor, with a goal of applying a dithering effect to streamed video from a webcam. Its a modification of code I put together to perform this same transformation to a static image, and that has no problems.
(also i know my code is quite un-optimized, i plan to clean things up once i get this fixed)
I have tested this sketch: https://editor.p5js.org/kellylougheed/sketches/ryYR3-cIM with my webcam and it works just fine, which leads me to believe its has something to do with how I am stepping through the pixel array. for the dithering effect, the x,y position of a pixel is used.
im hoping someone could shed some insight as to why this might not be working, thank you!!
I guess could some one just answer how this bit of code:
for (var y = 0; y < (photo.height-1) * d; y++) {
for (var x = 1; x < (photo.width -1) * d; x++) {
for (var i = 0; i < d; i++) {
for (var j = 0; j < d; j++) {
// loop over
var idx = 4 * ((y * d + j) * photo.width * d + (x * d + i));
is different than this:
for (var i = 0; i < capture.pixels.length; i += 4) {
// Edit the red value
capture.pixels[i] *= 1;
// Edit the green value
capture.pixels[i + 1] *= 1;
// Edit the blue value
capture.pixels[i + 2] *= 1;
}
Do both codes do the same thing? (I didn’t have the chance to test it).
I can tell you that one code is more readable than the other one.
In addition, one code is easier to maintain than the other one.
To explain the difference, you will need to print the value of x and i (also y and j) to convince yourself both codes do the same thing. Start with a Photo width and height of 4 and 6 pixels, for instance so you can see the output and interpret the result yourself. One thing: you need to tell us what is the value of d. I am guessing it is 4. However, guessing is not an efficient way to approach these questions.
d is the pixel density, and is annotated as such in the full code. I merely copy and pasted the related sections from each link that I posted above. yes they do the same thing. the top one takes a x,y coordinate and converts that to that corresponding pixels’ index within the pixel array, then performs the same tasks inside the loop on the bottom one. the only difference is the bottom one steps through the pixel array index-wise, the top one steps through based on x,y coordinate. I’d like to know if this difference is the source of my problem, and if not what could other problems be