以Promise风格调用: 支持
返回一个数组,用来描述 canvas 区域隐含的像素数据。在自定义组件下,操作组件内 <canvas> 组件。
属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| x | number | 否 | 将要被提取的图像数据矩形区域的左上角横坐标 | |
| y | number | 否 | 将要被提取的图像数据矩形区域的左上角纵坐标 | |
| width | number | 否 | 将要被提取的图像数据矩形区域的宽度 | |
| height | number | 否 | 将要被提取的图像数据矩形区域的高度 | |
| canvasId | string | 否 | 画布标识,传入<canvas/>的 canvas-id | |
| success | function | 否 | 接口调用成功的回调函数 | |
| fail | function | 否 | 接口调用失败的回调函数 | |
| complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
属性 | 类型 | 说明 |
|---|---|---|
| errMsg | string | |
| cancel | boolean | 是否取消 |
| confirm | boolean | 是否确认 |
function getCanvasImageData(canvasId, x, y, width, height) {
return new Promise((resolve, reject) => {
xhs.canvasGetImageData({
canvasId, // 画布标识,传入 <canvas/> 的 canvas-id
x, // 提取区域的左上角横坐标
y, // 提取区域的左上角纵坐标
width, // 提取区域的宽度
height, // 提取区域的高度
success: (res) => {
console.log('获取图像数据成功:', res);
resolve(res); // 返回图像数据
},
fail: (err) => {
console.error('获取图像数据失败:', err);
reject(err); // 返回错误信息
},
complete: () => {
console.log('获取图像数据操作完成');
}
});
});
}
// 调用示例
getCanvasImageData('myCanvas', 0, 0, 100, 100)
.then((res) => {
console.log('图像数据:', res);
})
.catch((err) => {
console.error('操作失败:', err);
});