qq_55463644 2021-12-07 11:11 采纳率: 0%
浏览 73

如何在微信公众号网页调整vue-canvas 生成的海报上面的头像,昵称,二维码的大小和位置

我在后台生成了一个二维码海报,微信扫码会进入微信公众号一个活动详情的网页,然后有个推广 再次生成海报 这个海报是在微信公众号网页上的根据微信用户名和头像还有当前活动详情页的网址生成 ,现在有个问题,我怎么调整 海报上面的头像昵称,和二维码的位置,

  • 写回答

1条回答 默认 最新

  • .︶ㄣ☆.'龍 2021-12-07 11:19
    关注

    参考如下代码

    painting: {
            width:`${document.documentElement.clientWidth}px`,
            height:`${document.documentElement.clientWidth*1.777}px`,
            background: '#f4f5f7',
            views: [
              {
                type: 'image',
                url: require('../../assets/XzyRescources/vipBg.png'),
                css: {
                  width:`${document.documentElement.clientWidth}px`,
                  height:`${document.documentElement.clientWidth*1.777}px`,
                  top: '0'
                }
              },
              {
                type: 'image',
                url: require('../../assets/XzyRescources/userImg.png'),
                css:{
                  width:`${document.documentElement.clientWidth/3.5}px`,
                  height:`${document.documentElement.clientWidth/3.5}px`,
                  top:`${document.documentElement.clientWidth/5.5}px`,
                  left: `${document.documentElement.clientWidth/2.8}px`,
                }
              },
              {
                type: 'qrcode',
                content:'19263',
                css: {
                  top: `${document.documentElement.clientWidth/1.25}px`,
                  left: `${document.documentElement.clientWidth/3.7}px`,
                  color: '#333',
                  width: `${document.documentElement.clientWidth/2.1}px`,
                  height: `${document.documentElement.clientWidth/2.1}px`
                }
              },
              {
                type: 'text',
                text: '兜兜里裹糖@',
                css: [
                  {
                    top:`${document.documentElement.clientWidth/2}px`,
                    left: `${document.documentElement.clientWidth/2.7}px`,
                    color:'rgba(52,52,52,1)',
                    fontSize: '17px'
                  }
                ]
              },
              {
                type: 'text',
                text: '- 长按保存二维码 -',
                css: [
                  {
                    top:`${document.documentElement.clientWidth*1.5}px`,
                    left: `${document.documentElement.clientWidth/3}px`,
                    color:'rgba(52,52,52,1)',
                    fontSize: '17px'
                  }
                ]
              },
            ],
          },
          img:'',
        }
    
    
    评论

报告相同问题?

问题事件

  • 创建了问题 12月7日

悬赏问题

  • ¥15 飞机曲面部件如机翼,壁板等具体的孔位模型
  • ¥15 vs2019中数据导出问题
  • ¥20 云服务Linux系统TCP-MSS值修改?
  • ¥20 关于#单片机#的问题:项目:使用模拟iic与ov2640通讯环境:F407问题:读取的ID号总是0xff,自己调了调发现在读从机数据时,SDA线上并未有信号变化(语言-c语言)
  • ¥20 怎么在stm32门禁成品上增加查询记录功能
  • ¥15 Source insight编写代码后使用CCS5.2版本import之后,代码跳到注释行里面
  • ¥50 NT4.0系统 STOP:0X0000007B
  • ¥15 想问一下stata17中这段代码哪里有问题呀
  • ¥15 flink cdc无法实时同步mysql数据
  • ¥100 有人会搭建GPT-J-6B框架吗?有偿