zhongguagua/react-canvas-poster

都不知道你的示例是如何通过编译的

Opened this issue · 0 comments

     {
        width: 360,
        height: 667,
        backgroundColor: '#fff',
        views: [
          // 绘制本地图片
          {
            type: 'image',
            url: require('./assets/bold.png'), // 远程图片可以直接改为图片地址
            top: 0,
            left: 0,
            width: 360,
            height: 667,
          },
          // 绘制带圆角+边框的图片
          {
            type: 'image',
            url: require('./assets/header.jpg'),
            top: 58,
            left: 165,
            width: 30,
            height: 30,
            borderRadius: 5,
            borderWidth: 2,
            borderColor: '#f0efefea',
          },
          // 绘制文字
          {
            type: 'text',
            content: 'react-canvas-poster简单快速的绘制canvas海报~~这是一段比较长的标题文字',
            fontSize: 14,
            color: '#f7f7f7',
            textAlign: 'center',
            top: 262,
            left: 180,
            width: 200,
            lineNum: 3,
            lineHeight: 20,
            baseLine: 'top',
          },
          // 绘制一条分割线
          {
            type: 'line',
            color: '#999',
            startX: 30,
            startY: 580,
            endX: 330,
            endY: 580,
            width: 2,
            lineCap: 'round',
          },
          // 绘制一个简易矩形
          {
            type: 'rect',
            width: 200,
            height: 200,
            x: 20,
            y: 50,
            paddingLeft: 10,
            paddingRight: 10,
            backgroundColor: '#fff',
          },
          // 二维码
          {
            type: 'qcode',
            text: 'https://github.com/whorcare/vue-canvas-poster-yufan',
            top: 420,
            left: 135,
            width: 90,
            height: 90,
          },
      }

这是示例提供的JSON都不是一段标准格式的Json。自己都不测试一下就给人用,作者太不严谨了。