xinda-miniprogram/src/components/customPoster/README.md

海报插件

基于wxml2canvas插件

插件引入

{
  "customPoster": "/components/customPoster/index"
}

<customPoster params="{{params}}"></customPoster>

参数示例

const data = {
  params: {
    info: { id: 'circle-note_mp', title: '动态页', desc: '指定动态的页面，mp' },
    body: {
      bgImg:
        'https://picsissiok-10049618.cos.ap-shanghai.myqcloud.com/a74018e725861534f1644cff04780f4e_16273677601587.png',
      width: '750',
      height: '1254',
    },
    elements: [
      {
        id: 'circle-name',
        desc: '圈名称',
        type: 1,
        text: '治疗讨论',
        font: '宋体',
        'font-size': '42',
        color: '#FFFFFF',
        'single-line': true,
        halign: 'center',
        top: '106',
      },
      {
        id: 'master-name',
        desc: '专家名称',
        type: 1,
        text: '健康小贴士',
        font: '宋体',
        'font-size': '38',
        color: '#FFFFFF',
        'single-line': true,
        halign: 'center',
        top: '237',
      },
      {
        id: 'master-avatar',
        desc: '专家头像',
        type: 0,
        picType: 'avatar',
        src: 'https://picsissiok-10049618.cos.ap-shanghai.myqcloud.com/ceb31ac6137e873225b8cc826389a267_16655329078962.jpg',
        width: '120',
        height: '120',
        halign: 'center',
        shape: 'circle',
        top: '328',
      },
      {
        id: 'note-content',
        desc: '动态内容',
        type: 1,
        text: '11月5日上海组织进口博览会CIIE大会，邀请大家来我们的展馆现场交流。',
        font: '宋体',
        'font-size': '45',
        color: '#18191A',
        width: '630',
        height: '348',
        left: '60',
        top: '495',
      },
      {
        id: 'note-title',
        desc: '长文标题',
        type: 1,
        text: '',
        font: '宋体',
        'font-size': '42',
        color: '#18191A',
        width: '659',
        height: '116',
        left: '46',
        top: '495',
        'font-weight': 'bold',
      },
      {
        id: 'note-summary',
        desc: '长文摘要 ',
        type: 1,
        text: '',
        font: '宋体',
        'font-size': '42',
        color: '#18191A',
        width: '672',
        height: '232',
        left: '39',
        top: '646',
      },
      {
        id: 'note-more',
        desc: '还有',
        type: 1,
        text: '还有3条精彩附件>',
        font: '宋体',
        'font-size': '31',
        color: '#666666',
        'single-line': true,
        width: '292',
        height: '46',
        left: '60',
        top: '1024',
      },
      {
        id: 'scanText',
        desc: '扫描二维码查看详情',
        type: 1,
        text: '扫描二维码查看详情',
        font: '宋体',
        'font-size': '31',
        color: '#666666',
        'single-line': true,
        width: '279',
        height: '43',
        left: '60',
        top: '1087',
      },
      {
        id: 'note-qrcode',
        desc: '专家列表的二维码',
        type: 0,
        picType: 'qrcode',
        src: 'https://family.devred.hbraas.com/proxy/mp.weixin.qq.com/cgi-bin/showqrcode?ticket=gQHJ8TwAAAAAAAAAAS5odHRwOi8vd2VpeGluLnFxLmNvbS9xLzAyUWhDdGhTWVNlTjMxMDAwMDAwN3gAAgSonPxjAwQAAAAA',
        width: '130',
        height: '130',
        left: '554',
        top: '1012',
      },
      {
        id: 'brand',
        desc: 'brand×华秉科技',
        type: 1,
        text: '做企业数字化转型的亲密伙伴×华秉科技',
        font: '宋体',
        'font-size': '24',
        color: '#B2B3B4',
        'single-line': true,
        halign: 'center',
        top: '1192',
      },
    ],
  },
}