维信小程序图片旋转

使用画布canvas解决这个问题，h5的canvas同理图片旋转这种东西总是晕，写下了便于我以后参考。wxml： <canvas canvas-id=“canvas” ></canvas>wxss:canvas { width: 320px; height: 240px;}js:Page({ onLoad: function(options) { drowImage(“image.png”) }}) 原图：图片旋转90function drowImage(path) { var canvasContext = wx.createCanvasContext(‘canvas’) var width = 320 var height = 240 canvasContext.translate(height, 0)//原点向 canvasContext.rotate(90 * Math.PI / 180) canvasContext.drawImage(path, 0, 0, width, height) canvasContext.draw(false)}图片旋转270function drowImage(path) { var canvasContext = wx.createCanvasContext(‘canvas’) var width = 320 var height = 240canvasContext.translate(0, width) canvasContext.rotate(270 * Math.PI / 180) canvasContext.drawImage(path, 0, 0, width, height) canvasContext.draw(false)}图片旋转180function drowImage(path) { var canvasContext = wx.createCanvasContext(‘canvas’) var width = 320 var height = 240 canvasContext.translate(width,height) canvasContext.rotate(180 * Math.PI / 180) canvasContext.drawImage(path, 0, 0, width, height)}