javascript - Trying to get average (mean) color of canvas vs slices thereof. getting inaccurate results -
I am trying to get the color of an image, so that the average color of different pieces of image is compared, To find that area, the most is different from the meaning. Based on the areas of this greatest interest, an image is a part of a project to automatically crop.
I was getting strange results, so I created a demo page that compares it with a completely flat red image with slides. Each piece should have the same color (192,02525525) but, as you can see, they do not:
(All data goes to the console)
Demo Here's the average color function:
var getAverageColor = function (canvas) {var reference = canvas.getContext ('2d'); Var imgdata = context.getImageData (0, 0, canvas.Wind, canvas.high); Var pixel = IMGD data; Var color = {red: 0, green: 0, blue: 0, alpha: 0}; // For each loop loop (var i = 0, n = pixel lang; i & lt; n; i + = 4) {color.red + = pixels [i] / 255; // red color green + = pixel [i + 1] / 255; // green color Blu + = pixels [i + 2] / 255; // blue color.lafa = = pixels [i + 3] / 255; // alpha} color.red = color.red/(pixels.length/4); Color.green = color.green/ (pixel / lb / 4); Color.blue = color.blue / (pixel.labi/4); Color.alpha = color.alpha / (pixels tall / 4); The color of the return; }
and there is a (simplified) loop version where it is called:
var findPointOfInterest = function (canvas) {var sliceSize = Math. Round (canvas.width / 20); Var avgcolor = getAverageColor (canvas); Console.log ("Avg Color:"); Console.log (avgColor); Var slice color = zero; For (var i = 0; i canvas.with) slicesis = canvas.wind% slice size; Var temp = document.createElement ('canvas'); Temp.width = sliceSize; Temp.height = canvas.height; Var reference = temp.getContext ('2d'); Context.clearRect (0, 0, slice siege, canvas.height); Context.drawImage (Canvas, I, 0, Slice Size, Canvas. High, 0, 0, Slice Size, Canvas. Highlight); Slicecolor = getAverageColor (temp); Console.log (sliceColor); }}
I have created a simple version of this issue for JSFDial but it does not look like a bug! GAH! Here's a simple version: (Everything logs for the console)
Can anyone help me track this thing?
Comments
Post a Comment