function ContourFinder() { this.pixelsWidth; // pixels width this.pixelsHeight; // pixels height this.pixels; // pixels (single array of r,g,b,a values of image) this.fColor; // foreground color this.bColor; // background color this.threshold; this.maxContourPoints = 500*10; //was 500*4 this.allpoints = []; this.findContours = function(image,foregroundColor,backgroundColor,threshold) { var w = this.pixelsWidth = image.width; var h = this.pixelsHeight = image.height; this.fColor = foregroundColor; this.bColor = backgroundColor; this.threshold = threshold; // create a new pixel array var imageCtx = image.getContext('2d'); alert(imageCtx); var imageData = imageCtx.getImageData(0,0,w, h); //console.log("imageData: ",imageData); var pixels = this.pixels = imageData.data; //console.log("pixels: ",pixels); var prevValue = 0; for (var y = 0; y < h; y++) { for (var x = 0; x < w; x++) { var index = y*w*4+x*4; //(y*w + x)*4; /*r = pixels[index+0]; g = pixels[index+1]; b = pixels[index+2]; a = pixels[index+3];*/ var factor = ((pixels[index] *.3 + pixels[index+1]*.59 + pixels[index+2]*.11) ) //console.log(index+": "+r+" "+" "+g+" "+b+" "+a); //var value = g; var value = (factor > threshold)? 255 : 0; // threshold //console.log(" > "+value); pixels[index+0] = value; pixels[index+1] = value; pixels[index+2] = value; //pixels[index+3] = value; } } //console.log("pixels: ",pixels); // copy the image data back onto the canvas //imageCtx.putImageData(imageData, 0, 0); // at coords 0,0 //return; var counter = 0; for (var y = 0; y < h; y++) { for (var x = 0; x < w; x++) { var index = y*w*4+x*4; r = pixels[index+0]; g = pixels[index+1]; b = pixels[index+2]; a = pixels[index+3]; var value = g; value = (value > threshold)? 255 : 0; // if we enter a foreGround color and red isn't 0 (already stored as contour) if(prevValue == backgroundColor && value == foregroundColor && r != 0) { var points = this.followContour([x,y]); this.allpoints.push(points); counter++; } //r = 255; pixels[index+0] = r; pixels[index+1] = g; pixels[index+2] = b; pixels[index+3] = a; prevValue = value; } } // console.log("counter: " +counter); // console.log(this.getPoints(points)); // console.log("======================================"); /*for (var i = 0, n = pixels.length; i < n; i += 4) { var grayscale = pixels[i ] * .3 + pixels[i+1] * .59 + pixels[i+2] * .11; alpha = pixels[i+3]; //console.log("alpha: ",alpha); var value = (alpha > threshold)? 255 : 0; //console.log("value: ",value); /*pixels[i ] = value; // red pixels[i+1] = value; // green pixels[i+2] = value; // blue pixels[i+3] = value; // alpha*/ /* if(alpha > threshold) { pixels[i ] = 255; // red } }*/ /*for (var y = 0; y < height; y++) { inpos = y * width * 4; // *4 for 4 ints per pixel outpos = inpos + w2 * 4 for (var x = 0; x < w2; x++) { r = imageData.data[inpos++] / 3; // less red g = imageData.data[inpos++] / 3; // less green b = imageData.data[inpos++] * 5; // MORE BLUE a = imageData.data[inpos++]; // same alpha b = Math.min(255, b); // clamp to [0..255] imageData.data[outpos++] = r; imageData.data[outpos++] = g; imageData.data[outpos++] = b; imageData.data[outpos++] = a; } }*/ // copy the image data back onto the canvas imageCtx.putImageData(imageData, 0, 0); // at coords 0,0 } this.followContour = function(startPoint) { //console.log("followContour @",startPoint); points = []; // start new contour points.push(startPoint); var w = this.pixelsWidth; var h = this.pixelsHeight; //console.log("w :",w," h: ",h); var point = startPoint; var numPoints = 0; // define neighborhood (array of 4, with: // x offset, y offset, index offset var neighborhood = [ [1,0,1,3], // east [0,1,w,0], // south [-1,0,-1,1], // west [0,-1,-w,2] // north ]; var prevIndex; var nextNeighbor = 0; // starting point for neighborhood search (index for neighborhood array) do { //console.log(" point: ",point[0],point[1]); var x = point[0]; var y = point[1]; // go clockwise trough neighbors (starting at east side) var index = y*w*4+x*4; this.pixels[index] = 0; // r this.pixels[index+2] = 0; // b var newPoint; //console.log(" index: ",index); var i = nextNeighbor; //console.log(" nextNeighbor: ",nextNeighbor); for(var j=0;j "; } return log; } }