收藏
回答

canvas开发工具渲染正常,IOS真机不绘制?

import { promiseWxApi } from '../../utils/util.js'

Page({
  onLoad(options) {
    wx.createSelectorQuery()
      .select('#canvas1')
      .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.fillStyle = '#ffffff'
        ctx.fillRect(0, 0, canvas.width, canvas.height)
        // 绘制作品图片
        this.renderArtworkImg(canvas, 'https://picasso.pixcity.net/images/artwork/3bxjoy02kz8c320d/a083a60ce340f3bb10927907abb4b5ea/original/wx5e78935c81104646.o6zajszne4uvrcaapzm8n6bsvfni.muhsjfgntmym3ad2f0e5a40aa6b94348bf333e405bf6.jpg')
      })
  },

  async renderArtworkImg(canvas, imgPath) {
    const context = canvas.getContext('2d')
    const { tempFilePath } = await promiseWxApi(wx.downloadFile)({
      url: imgPath
    })
    const { width: imgWidth, height: imgHeight } = await promiseWxApi(wx.getImageInfo)({
      src: tempFilePath
    })
    const image = canvas.createImage()
    image.onload = () => {
      context.drawImage(image, 0, 0, imgWidth, imgHeight, 0, 0, canvas.width, 100)
    }
    //  注意只能是本地图片
    image.src = tempFilePath
  }
})


最后一次编辑于  2020-05-05
回答关注问题邀请回答
收藏

2 个回答

  • 疯狂的小辣椒
    疯狂的小辣椒
    2020-05-06

    你好,canvas 2d暂不支持真机调试

    2020-05-06
    有用
    回复 6
    • 攻城狮@射鸡屎
      攻城狮@射鸡屎
      2020-05-06
      为什么预览又可以,但是奇怪的是有的图片onload里面获取不到res对象
      2020-05-06
      回复
    • Jacky
      Jacky
      2020-05-10
      问题是,发布到试用版也不绘制呢!!!
      2020-05-10
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2020-05-11回复Jacky
      打开vconsole看看
      2020-05-11
      回复
    • Jacky
      Jacky
      2020-05-12回复疯狂的小辣椒
      没有任何错误或警告,我通过Canvas绘制保存图片到相册,IDE中可以保存到电脑,但是手机保存下来是空白的。
      2020-05-12
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2020-05-12回复Jacky
      是只有上面截图的iPhonexr在体验版有问题?提供能复现问题的简单代码片段https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html
      2020-05-12
      回复
    查看更多(1)
  • 王浩Hanks🇨🇳
    王浩Hanks🇨🇳
    2020-05-05

    解决了么

    ༺࿈有用࿈༻   ✧(≖ ◡ ≖✿)   ♪ ♩ ♫ ♬ ¶ ‖♭ ♯ ♪ § ∮ ♪ ※ ∴ ∵ ♬ ∽ ¥ ♪ Ψ $♪

    2020-05-05
    有用
    回复 2
    • Jacky
      Jacky
      2020-05-05
      木有
      2020-05-05
      回复
    • 王浩Hanks🇨🇳
      王浩Hanks🇨🇳
      2020-05-05回复Jacky
      康康这个是啥,是不是有问题
      2020-05-05
      回复
登录 后发表内容
问题标签