绘制的图片,文字等十分模糊
添加以下代码,通过设置分辨率来解决
const dpr = wx.getSystemInfoSync().pixelRatio
canvas.width = res[0].width * dpr
canvas.height = res[0].height * dpr
ctx.scale(dpr, dpr)
完整代码:文章来源:https://www.toymoban.com/news/detail-693580.html
<!-- canvas.wxml -->
<canvas type="2d" id="myCanvas"></canvas>
// canvas.js
Page({
onReady() {
const query = wx.createSelectorQuery()
query.select('#myCanvas')
.fields({ node: true, size: true })
.exec((res) => {
const canvas = res[0].node
const ctx = canvas.getContext('2d')
//添加这些代码,通过分辨率重新设置
const dpr = wx.getSystemInfoSync().pixelRatio
canvas.width = res[0].width * dpr
canvas.height = res[0].height * dpr
ctx.scale(dpr, dpr)
ctx.fillRect(0, 0, 100, 100)
})
}
})
模糊不清的时候 多多进行调试一下就可以了 多尝试新方案 文章来源地址https://www.toymoban.com/news/detail-693580.html
到了这里,关于微信小程序canvas画布不清晰解决方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!