Add Dither Effect to Example Image
This commit is contained in:
parent
c5a68ea94b
commit
763512a3b1
2 changed files with 9 additions and 5 deletions
|
@ -14,8 +14,8 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<canvas id="input" width="712" height="470"></canvas>
|
||||
<canvas id="input"></canvas>
|
||||
|
||||
<canvas id="output" width="712" height="470"></canvas>
|
||||
<canvas id="output"></canvas>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -8,11 +8,15 @@ ImageElement inputImg;
|
|||
ImageElement outputImg;
|
||||
|
||||
void main() {
|
||||
inputImg = new ImageElement(src: 'kitten.jpg', width: 712, height: 470);
|
||||
inputImg = new ImageElement(src: 'kitten.jpg');
|
||||
|
||||
input = document.querySelector('#input');
|
||||
output = document.querySelector('#output');
|
||||
|
||||
input.width = inputImg.width;
|
||||
input.height = inputImg.height;
|
||||
output.width = inputImg.width;
|
||||
output.height = inputImg.height;
|
||||
inputImg.onLoad.listen(imgLoaded);
|
||||
}
|
||||
|
||||
|
@ -20,9 +24,9 @@ void imgLoaded(Event e) {
|
|||
print("image loaded");
|
||||
input.context2D.drawImage(inputImg, 0, 0);
|
||||
|
||||
PixelArray px = new PixelArray.fromImageData(getImageData(input), 712);
|
||||
PixelArray px = new PixelArray.fromImageData(getImageData(input), input.width);
|
||||
px = Pixed.greyscale(px);
|
||||
|
||||
px = Pixed.dither(px);
|
||||
output.context2D.putImageData(px.toImageData(), 0, 0);
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue