canvas基础画图/前端定时分页

1.canvas基础画图

- <template>

  <canvas id='canvas' width ='1800' height ='600' style='margin:0 auto'></canvas>

</template>

-js

  const canvas = document.getElementById('canvas');

  const ctx = canvas.getContext('2d');

// 字体

  ctx.font = "36px MicrosoftYaHei-Bold"

 ctx.textBaseline = 'middle'

 ctx.textAlign = 'center’

ctx.fillStyle=‘’   // 颜色

ctx.fillText(‘字体’,+ItemtaxX+ItemWidth/2,+ItemtaxY+ItemHeight/2)

// 背景色及坐标画图

ctx.fillStyle = "rgba(255,255,255,0.7)"  ----- ctx.fillRect(x,y,宽,高); 

// 边框及背景色

 ctx.strokeStyle ='#011848';  ----  ctx.strokeRect(x,y,宽,高) --- ctx.lineWidth = 5

-  注意 每种颜色后需跟对应的状态 否则颜色不生效

2.前端定时分页  (例如一共50条数据 一页6条,五秒后切换下一页)

<->两个时间相隔多少天

    var diffTime = moment(tag.regTime).diff(

        moment(tag.startTime)

      );

      var s = moment(tag.regTime).isBefore(Date(), "day")

        ? "期"

        : "剩余" + Math.floor(diffTime / (1000 * 60 * 60 * 24)) + "";