Function imgGetCanvasRect

  • imgGetCanvasRect(canvas, x, y, width, height, exportType?, exportQuality?): Promise<Blob | undefined>

  • 获取canvas指定区域的图像数据并导出为Blob对象（需要确保canvas的画布未被污染）。
    如果不需要指定区域，那么直接用canvas.toBlob方法，因为这个方法会通过临时canvas中转。
    如果需要将Blob提供给其他元素加载，可以使用URL.createObjectURL方法创建链接

    Parameters

    • canvas: HTMLCanvasElement

      画布元素

    • x: number

      图像矩形区域的左上角X坐标

    • y: number

      图像矩形区域的左上角Y坐标。

    • width: number

      图像矩形区域的宽度。

    • height: number

      图像矩形区域的高度

    • OptionalexportType: string

      可选参数，指定导出文件类型，默认为 'image/png'

    • OptionalexportQuality: number

      可选参数，指定导出图片质量（0-1），在指定图片格式为 image/jpeg 或 image/webp 的情况下，可以从 0 到 1 的区间内选择图片的质量。如果超出取值范围，将会使用默认值 0.92。

    Returns Promise<Blob | undefined>

    Example

    // 获取指定区域并导出为png图片
    const blob = await imgGetCanvasRect(canvasElement, 10, 20, 150, 100)
    if (blob) {
      console.log('Blob created:', blob);
    }

Settings

Member Visibility