pixi.js 导出部分区域裁剪图片

方案

先通过api到出image对象,在通过canvas绘制图片,在导出数据

代码

const { x, y } = this.app.stage.getBounds() // 超出的x,y
const stageImage = this.app.renderer.plugins.extract.image(this.app.stage, "image/jpeg", 1)
stageImage.onload = () => {
  const canvasElement = document.createElement('canvas')
  const ctx: any = canvasElement.getContext('2d')
  canvasElement.width = this.width
  canvasElement.height = this.height
  ctx.drawImage(stageImage, -x, -y, this.width, this.height, 0, 0, this.width, this.height)
  const data = canvasElement.toDataURL("image/jpeg")
  const download = document.createElement('a')
  download.href = data
  download.download = '测试图片'
  download.click();
  download.remove()
}

你可能感兴趣的:(2022,javascript,前端,css3)