function paint(ctx, w, h, mask, color, alpha) {
  if (!mask) return;

  const [r, g, b] = chroma(color).rgb();

  alpha = Math.round(alpha * 255.0);

  let x;
  let y;
  const { data, bounds, width: maskW } = mask;
  const imgData = ctx.createImageData(w, h);

  for (y = bounds.minY; y <= bounds.maxY; y++) {
    for (x = bounds.minX; x <= bounds.maxX; x++) {
      if (data[y * maskW + x] === 0) continue;
      const k = (y * w + x) * 4;

      imgData.data[k] = r;
      imgData.data[k + 1] = g;
      imgData.data[k + 2] = b;
      imgData.data[k + 3] = alpha;
    }
  }

  ctx.putImageData(imgData, 0, 0);
}
Given some mask with non-zero values indicating pixels to color, draws it on the given
canvas Context.
@param ctx Canvas 2D context to use for drawing the image data.
@param w When creating an image from the mask, the width of that image.
@param h When creating an image from the mask, the height of that image.
@param color Chroma.js compatible RGB color to use when drawing the mask.
@param alpha Float 0 to 1 value of how much opacity to use for thresholded, filled pixels.