在canvas画布上画一张超过屏幕宽度的图,在手机上安卓和IOS上表现不一致?
发布于 5 年前 作者 gjin 8084 次浏览 来自 问答

请教大神这是什么原因? 感谢

画一张图到画布上面,画布长宽和这张图片一致,这行图片宽度超过设备屏幕宽度

手机上看到一张不完整的图片

IOS效果:上下左右都可以滑动

安卓:只能上下滑动 左右不能滑动

问题是为什么IOS能左右滑动,安卓确不能左右滑动????

现在希望安卓也可以左右画到查看这个图片,不知道怎么改。

xml:

<canvas canvas-id="canvas" class='canvasviewup' style="width:{{shwotestCanvasW}}px;height:{{shwotestCanvasH}}px;border:1px solid red;postion:fixed" canvas-id="shwotestCanvas"></canvas>

js:

var that = this;

var w;

var h;


wx.getImageInfo({

src: '../../Images/cs2.jpg',

success: (ress) => {

console.log(ress.width, ress.height)

w = ress.width;

h = ress.height;

that.setData({

shwotestCanvasW: ress.width,

shwotestCanvasH: ress.height

})


let ctx = wx.createCanvasContext('shwotestCanvas')

//将图片src放到cancas内,宽高为图片大小

ctx.drawImage('../../Images/cs2.jpg', 0, 0, w, h)

ctx.draw()

}

4 回复

你好,麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

canvas快高 与 图片宽高都需要设置的

小伙子,你比例没设置

const canvas = e[0].node

    const width = e[0].width

    const height = e[0].height

    const ctx = canvas.getContext("2d")

    const dpr = wx.getSystemInfoSync().pixelRatio

    canvas.width = width*dpr

    canvas.height = height*dpr

    ctx.scale(dpr,dpr)

回到顶部