canvas的scales（-1,1）在ios上无法实现左右翻转的解决方法

canvas的scales（-1,1）无法实现左右翻转,在真机Android和开发工具上都是没问题的，在真机ios上没反应。原因是因为：

 在ios端中scale 里不能传负数，传了-1也会当成1

官方至今也未给出相关的支持方式。

该怎么办呢，下面推荐一个在微信开放平台中一位大佬提供的方式：

https://developers.weixin.qq.com/s/dp1VOKmY7b3m

可直接点击该链接打开微信开发者工具。下面也给大家贴出代码（建议点击上方链接打开，下方代码需要自行准备一张图片）

.js


Page({
    data: {

    },
    onLoad: function() {
        this.canvas = wx.createCanvasContext("canvas", this)
        wx.getImageInfo({
            src: '/gsl.png',
            success: res => {
                this.setData({
                    height: res.height,
                    width: res.width
                }, () => {
                    this.canvas.drawImage("/gsl.png")
                    this.canvas.draw(false, () => {
                        wx.canvasGetImageData({
                            canvasId: 'canvas',
                            x: 0,
                            y: 0,
                            width: this.data.width,
                            height: this.data.height,
                            success: res => {
                                console.log(res)
                                let data = res.data
                                let length = data.length
                                let width = 4 * res.width
                                let pos = 0
                                let array = []
                                let result = []
                                let test = 0
                                let colorArray = []
                                for (let index = 0; index < length; index++) {
                                    colorArray.push(data[index])
                                    if (colorArray.length == 4) {
                                        array.push(colorArray.concat())
                                        colorArray = []
                                    }
                                    pos++
                                    if (pos >= width) {
                                        pos = 0
                                        let temp = []
                                        array.reverse().forEach(item => {
                                            temp = temp.concat(item)
                                        })
                                        result = result.concat(temp)
                                        array = []
                                    }
                                }

                                let output = new Uint8ClampedArray(result)

                                wx.canvasPutImageData({
                                    canvasId: 'canvasOut',
                                    data: output,
                                    x: 0,
                                    y: 0,
                                    width: this.data.width,
                                    height: this.data.height,
                                })
                            }
                        })
                    })
                })
            }
        })
    },
})

.wxml

<canvas canvas-id="canvas" style="width:{{width}}px;height:{{height}}px"></canvas>
<canvas canvas-id="canvasOut" style="width:{{width}}px;height:{{height}}px"></canvas>

最后，感慨一句，技术真的是伟大的！