xxxxxxxxxx
120
let pic;
let captured = false;
let refX, refY;
let centeredX,centeredY
let rRef = 0;
let gRef = 0;
let bRef = 0;
let refColor = 0;
let squareSize = 1;
let buffer = 40;
let r, g, b;
let ourFrameRate = 15;
function preload() {
pic = loadImage('mimiYin.jpg');
}
function setup() {
createCanvas(windowWidth, windowHeight);
pixelDensity(1);
background(0);
pic.loadPixels();
// aspect=pic.height/pic.width;
//copy(pic,0,0,pic.width,pic.height,0,0,width,width*aspect);
//centeredX=width/2-pic.width/2;
// centeredY=height/2-pic.height/2;
image(pic, 0,0);
}
function draw() {
//background(220);
frameRate(ourFrameRate);
colorChange();
//pic.updatePixels();
// if(frameCount % ourFrameRate/4 == 0) {
squareSize += 3;
// }
if (squareSize > pic.width && squareSize>pic.height) {
noLoop();
}
}
function mouseClicked() {
refX = mouseX;
refY = mouseY;
squareSize=1;
// console.log(mouseX, mouseY);
//console.log(refX, refY);
captureColor();
}
function captureColor() {
refColor = get(refX, refY);
rRef = red(refColor);
gRef = green(refColor);
bRef = blue(refColor);
captured = true;
//console.log(refX, refY, rRef,gRef,bRef);
}
function colorChange() {
// push();
// translate (centeredX,centeredY);
// for (let x = refY - (squareSize / 2); x < refY + (squareSize / 2); x++) {
// for (let y = refX - (squareSize / 2); y < refX + (squareSize / 2); y++) {
for (let y = refY - (squareSize / 2); y < refY + (squareSize / 2); y++) {
for (let x = refX - (squareSize / 2); x < refX + (squareSize / 2); x++) {
let index = (y * pic.width + x) * 4;
let r = pic.pixels[index];
let g = pic.pixels[index + 1];
let b = pic.pixels[index + 2];
pic.pixels[index + 3] = 255;
if (r > rRef - buffer && r < rRef + buffer) {
redMatch = true;
// console.log('redMatch');
} else redMatch = false;
if (g > gRef - buffer && g < gRef + buffer) {
greenMatch = true;
// console.log('greenMatch');
} else greenMatch = false;
if (b > bRef - buffer && b < bRef + buffer) {
blueMatch = true;
// console.log('blueMatch');
} else blueMatch = false;
if (dist(x, y, refX, refY) < squareSize / 2) {
withinCircle = true;
// console.log('withinCircle');
} else withinCircle = false;
if (redMatch && greenMatch && blueMatch) {
// pic.pixels[index] = b;
// pic.pixels[index + 1] = r;
// pic.pixels[index + 2] = g;
let pointR = g;
let pointG = b;
let pointB = r;
stroke(pointR, pointG, pointB);
strokeWeight(1);
point(x, y);
}
}
}
//pop();
}