ImageData resize on Canvas

image-data-resize.js

export async function resizeImageData (imageData, width, height) {
  const resizeWidth = width >> 0
  const resizeHeight = height >> 0
  const ibm = await window.createImageBitmap(imageData, 0, 0, imageData.width, imageData.height, {
    resizeWidth, resizeHeight
  })
  const canvas = document.createElement('canvas')
  canvas.width = resizeWidth
  canvas.height = resizeHeight
  const ctx = canvas.getContext('2d')
  ctx.scale(resizeWidth / imageData.width, resizeHeight / imageData.height)
  ctx.drawImage(ibm, 0, 0)
  return ctx.getImageData(0, 0, resizeWidth, resizeHeight)
}

Thank you. It worked really well :)

Im glad it helped :)

thanks you, it's help to me

thanks it's good. But why you used bit operator? Is it faster than not using?

@Hyodori04 in this case the bit operator is the same as Math.floor(value / 2). The bit operator is faster but in this case its was just to reduce the amount of code.

For more details check this MDN link

@mauriciomassaia thanks for quick answer. I understand what you mean