小程序
小游戏
企业微信
微信支付
扫描小程序码分享
canvas生成的图片不能覆盖整个屏幕，这是怎么回事？
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
windowHeight 就是获取手机屏幕的高度,然后设置canvas的高度为屏幕的高度，然后导出图也是canvas的高度,导出的图片的长度高度都是canvas的宽高，但在预览的时候下面就如上图有一段黑
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
windowHeight 是从哪里读取的呢？尝试使用 getUserInfo 中的 screenHeight
<view wx:if="{{show==true}}" >
<canvas style="width:100%;height:{{windowHeight}}px;" canvas-id="myCanvas"></canvas>
</view>
save: function () {
let that = this;
wx.showLoading({
title: '正在生成',
mask: 'true'
})
that.setData({
show: true
that.drawimage(that.data.windowWidth, that.data.windowHeight)
setTimeout(() => {
wx.canvasToTempFilePath({
x: 0,
y: 0,
width: that.data.windowWidth,
height: that.data.windowHeight,
canvasId: 'myCanvas',
success: function (res) {
wx.hideLoading()
console.log(res.tempFilePath)
show:false
wx.previewImage({
urls: [res.tempFilePath],
}
},3000)
},
drawimage: function (width,height){
const ctx = wx.createCanvasContext('myCanvas')
ctx.drawImage('../../static/images/2.jpg', 0, 0, width, height)
ctx.draw()
有一段黑
你好，请提供一下能复现问题的简单代码示例。
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
windowHeight 就是获取手机屏幕的高度,然后设置canvas的高度为屏幕的高度，然后导出图也是canvas的高度,导出的图片的长度高度都是canvas的宽高，但在预览的时候下面就如上图有一段黑
windowHeight 是从哪里读取的呢？尝试使用 getUserInfo 中的 screenHeight
<view wx:if="{{show==true}}" >
<canvas style="width:100%;height:{{windowHeight}}px;" canvas-id="myCanvas"></canvas>
</view>
save: function () {
let that = this;
wx.showLoading({
title: '正在生成',
mask: 'true'
})
that.setData({
show: true
})
that.drawimage(that.data.windowWidth, that.data.windowHeight)
setTimeout(() => {
wx.canvasToTempFilePath({
x: 0,
y: 0,
width: that.data.windowWidth,
height: that.data.windowHeight,
canvasId: 'myCanvas',
success: function (res) {
wx.hideLoading()
console.log(res.tempFilePath)
that.setData({
show:false
})
wx.previewImage({
urls: [res.tempFilePath],
})
}
})
},3000)
},
drawimage: function (width,height){
const ctx = wx.createCanvasContext('myCanvas')
ctx.drawImage('../../static/images/2.jpg', 0, 0, width, height)
ctx.draw()
}
你好，请提供一下能复现问题的简单代码示例。