putimagedata和getimagedata在ios中坐标系原点错误 - WXOPEN Club

你想反馈一个 Bug

如果是 Bug：

使用wx.canvasPutImageData 画一组Uint8ClampedArray数据时，在微信开发者工具和安卓手机端看到的图如下：

而在IOS手机看到的图如下：

canvas的坐标系原点是在左上角，但是微信的putimagedata和getimagedata在IOS上的坐标系原点在左下角。

* 提供一个最简复现 Demo

var rectdata = [

0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, … //因为提问字数限制，删除了剩余数据

];

Page({

data: {

motto: ‘Hello World’,

userInfo: {}

putDraw: function() {

const rectData = new Uint8ClampedArray(rectdata);

wx.canvasPutImageData({

canvasId: ‘secCanvas’,

x: 20,

y: 20,

width: 60,

data: rectData,

success(res) {

console.log(res)

fail(res) {

console.log(res)

}

})

onLoad: function() {},

onReady: function() {

this.putDraw()

}

})

希望官方能尽快修复该bug~~

4 回复

wantao1 楼6 年前

手动实现了一下反转

// /utils/util.js

const concatArrayBuffer = (…arrays) => {

let totalLength = 0;

for (let arr of arrays) {

totalLength += arr.length;

}

let result = new Uint8ClampedArray(totalLength);

let offset = 0;

for (let arr of arrays) {

result.set(arr, offset);

offset += arr.length;

}

return result;

}

const revertImage = (data, width, height) => {

if (!data) return data;

let dataViews = [];

let len = width * 4;

for (let i = 0; i < height; i++) {

let start = i * width * 4;

let newBuff = data.slice(start, start + len);

dataViews.unshift(newBuff);

}

let result = concatArrayBuffer(…dataViews);

return result.buffer;

}

module.exports = {

revertImage

}

// /pages/XXXPage.js

wx.canvasGetImageData({

canvasId: ‘myCanvas’,

x: 0,

y: 0,

width: width,

height: height,

success(res) {

wx.hideLoading();

// 3. IOS图像反转

let buffer = res.data.buffer;

try {

let systemInfo = wx.getSystemInfoSync();

let platform = systemInfo.platform;

if (platform === ‘ios’) {

buffer = util.revertImage(res.data, res.width, res.height);

}

} catch (e) {

}

…

xiulanmeng2 楼6 年前

尼玛三个月了官方没人吗

wanchao3 楼6 年前

mark

gangxie4 楼4 年前

有没有微信的同学能看下这个问题啊~