News and graphics at @ClimateLab, a project of @PostGraphics.
function average(image, context, n){
context.drawImage(image, 0, 0);
const imageData = context.getImageData(0, 0, image.naturalWidth, image.naturalHeight);
for (let i = 0, l = imageData.data.length; i < l; i += n) {
const r = d3.range(i, i + n - 1);
const avg = d3.mean(r, (d, i) => imageData.data[d]);
for (let i0 = 0, l0 = r.length; i0 < l0; i0++){
if ((i0 + 1) % 4 !== 0) imageData.data[r[i0]] = avg; // Only update the RGB values (not the A)
}
}
context.putImageData(imageData, 0, 0, 0, 0, image.naturalWidth, image.naturalHeight);
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
