Como dice el título, quiero saber cómo pixelar el ruido. Estoy usando el siguiente código para optimizar el rendimiento:
var totalXoff = 0.0; var draw = function() { background(0, 255, 255); if (!this.loadPixels){ return; } this.loadPixels(); var pixels=this.imageData.data; var xoff = 0.0+totalXoff; for (var x = 0; x < width; x++) { var yoff = 0.0; for (var y = 0; y < height/2; y++) { var bright = map(noise(xoff, yoff), 0, 1, 0, 255); var index = (y * width + x) * 4; pixels[index] = bright*2-(y/2*2.55); pixels[index + 1] = 255; pixels[index + 2] = 255; pixels[index + 3] = 255; yoff += 0.01; } xoff += 0.01; } this.updatePixels(); totalXoff += 0.0025; };¿Cómo lo haría pixelado? (Estoy optando por un estilo de arte de píxeles en mi juego, así que no quiero que las nubes se vean demasiado realistas).
Descubrí cómo hacerlo, simplemente los espacié y usé rect() en lugar de editar los píxeles para crear ese efecto "pixelado".
Código:
var totalXoff = 0.0; var draw = function() { background(0, 255, 255); var xoff = 0.0+totalXoff; for (var x = 0; x < width; x+=10) { var yoff = 0.0; for (var y = 0; y < height/2; y+=10) { var bright = map(noise(xoff, yoff), 0, 1, 0, 255); fill(bright*2.5-(y/1.5*2.55), 255, 255); rect(x, y, 10, 10); yoff += 0.01; } xoff += 0.01; } totalXoff += 0.0025; };