Skip to content
Permalink
Browse files

greyscale and reduce colors

  • Loading branch information...
jeremy0613 committed Apr 2, 2019
1 parent 2e34143 commit 063f90ecfa7969fe4c5d062f8d0a12df6d64481b
Showing with 31 additions and 7 deletions.
  1. BIN images/cat-grayscale.jpg
  2. +5 −7 index.html
  3. +26 −0 script.js
Binary file not shown.
@@ -15,9 +15,9 @@
import * as classes from '/script.js'
const W = 300
const H = 400
const N = 10 // nearest color threashold
const W = 500
const H = 700
const N = 15 // nearest color threashold
// call the sub class
let test = new classes.ReduceColors()
@@ -30,11 +30,9 @@
.then(function(e){
test.draw(i,e[0].img)
test.loopPixels(test.getData(i),[{
f:test.nearestPixel,
f:test.reduceColor,
params:{
i:j,
l:N,
ctx:test._ctx
f:4
}
}]).then(function(p) {
test.drawBuffer(p,j)
@@ -190,6 +190,32 @@ export class ReduceColors extends ImageData {
p.buffer[j+1] = max.c[1]
p.buffer[j+2] = max.c[2]
}
/**
* @param {Object}
* @param {Number}
* @param {Number}
* @param {Number}
* @param {Object} parameters
* @param {Object} reference the calling class
* */
grayScale(p,w,h,j,params,$t) {
p.buffer[j] = Math.floor(Math.round(params.f * p.buffer[j] / 255) * (255/params.f))
p.buffer[j+1] = Math.floor(Math.round(params.f * p.buffer[j] / 255) * (255/params.f))
p.buffer[j+2] = Math.floor(Math.round(params.f * p.buffer[j] / 255) * (255/params.f))
}
/**
* @param {Object}
* @param {Number}
* @param {Number}
* @param {Number}
* @param {Object} parameters
* @param {Object} reference the calling class
* */
reduceColor(p,w,h,j,params,$t) {
p.buffer[j] = Math.floor(Math.round(params.f * p.buffer[j] / 255) * (255/params.f))
p.buffer[j+1] = Math.floor(Math.round(params.f * p.buffer[j+1] / 255) * (255/params.f))
p.buffer[j+2] = Math.floor(Math.round(params.f * p.buffer[j+2] / 255) * (255/params.f))
}
}
/**
* @class Colors

0 comments on commit 063f90e

Please sign in to comment.
You can’t perform that action at this time.