experiments/floyd-steinberg-dithering
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Add Dither Effect to Example Image

Browse source
This commit is contained in:
Unknown 2018-02-14 18:00:57 +01:00
parent c5a68ea94b
commit 763512a3b1
2 changed files with 9 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
web/index.html
View file

@ -14,8 +14,8 @@
</head> </head>
<body> <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> </body>
</html> </html>

10
web/main.dart
View file

@ -8,11 +8,15 @@ ImageElement inputImg;
ImageElement outputImg; ImageElement outputImg;
void main() { void main() {
inputImg = new ImageElement(src: 'kitten.jpg', width: 712, height: 470); inputImg = new ImageElement(src: 'kitten.jpg');
input = document.querySelector('#input'); input = document.querySelector('#input');
output = document.querySelector('#output'); output = document.querySelector('#output');
input.width = inputImg.width;
input.height = inputImg.height;
output.width = inputImg.width;
output.height = inputImg.height;
inputImg.onLoad.listen(imgLoaded); inputImg.onLoad.listen(imgLoaded);
} }
@ -20,9 +24,9 @@ void imgLoaded(Event e) {
print("image loaded"); print("image loaded");
input.context2D.drawImage(inputImg, 0, 0); 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.greyscale(px);
px = Pixed.dither(px);
output.context2D.putImageData(px.toImageData(), 0, 0); output.context2D.putImageData(px.toImageData(), 0, 0);
} }