Twitter @_cjwallace
Fuzzy people with BodyPix v2
outputPixels = {
let inputPixels = Array.from(input.data)
for (let mask of segmentation) {
inputPixels = maskImage(inputPixels, mask)
}
let output = new ImageData(WIDTH, HEIGHT)
output.data.set(inputPixels)
return output
}
input = {
let ctx = DOM.canvas(image.width, image.height).getContext("2d");
ctx.drawImage(image, 0, 0);
return ctx.getImageData(0, 0, image.width, image.height)
}
function maskImage(pixels, mask) {
"Mask the image by replacing each pixel in the person segmentation with a randomly selected nearby pixel"
let maskPixels = mask.data
// iterate over pixels
for (let ix = 0; ix < maskPixels.length; ix++) {
let [x_, y_] = ixToCoords(4*ix, mask.width)
// mask pixel in image if part of target segment
if ((target == "PEOPLE" && (maskPixels[ix] != -1)) ||
(target == "HEADS" && maskPixels[ix] in [0,1])) {
pixels = maskPixel(pixels, x_, y_)
}
}
return pixels
}
function maskPixel(pixels, x, y) {
"Replace a pixel with a random nearby pixel."
let [shiftedX, shiftedY] = randomNoise(x, y)
// pixels have four indices corresponding to rgba channels
for (let j=0; j<4; j++) {
pixels[coordsToFirstIx(x, y, WIDTH)+j] = pixels[coordsToFirstIx(shiftedX, shiftedY, WIDTH)+j]
}
return pixels
}
function coordsToFirstIx(x, y, width) {
return 4 * (x + y * width)
}
function ixToCoords(ix, width) {
let x = Math.floor(ix % (4 * width) / 4)
let y = Math.floor(ix / (4 * width))
return [x, y]
}
function randomNoise(x, y) {
let scale = NOISE
// initialization and while to avoid boundary effects of shifting to outside the image
let shiftX = -1
let shiftY = -1
while (shiftX < 0 || shiftX >= WIDTH || shiftY < 0 || shiftY >= HEIGHT ) {
shiftX = x + randInt(-scale, scale)
shiftY = y + randInt(-scale, scale)
}
return [shiftX, shiftY]
}
function randInt(min, max) {
return Math.floor(Math.random() * (max - min + 1) ) + min
}
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.
