用画布画表格遇到的问题

一个两个表头用画布画表格,能合并单元格

阅读 1.5k
1 个回答

向来我只提供思路,具体还得靠你自己

而且你这个表格表头好像也不太对序号和时间单独两列合并,苹果香蕉雪梨合并,番茄茄子青瓜合并才对

// 遍历行,画横线
  for (var i = 0; i < data.length + 3; i++) {
    
    
    // 横线
    ctx.moveTo(0, rectH * i);
    ctx.lineTo(canvas.width, rectH * i);
    ctx.stroke();
  }
  
  // 遍历列,画竖线
  for(var i = 1; i < arr.length; i++) {
    if(i === 1) {
      // 第一列 从第二行的上边沿画到第五行的上边沿
      ctx.moveTo(rectW * i, rectH);
      ctx.lineTo(rectW * i, 5 * rectH);
    } else if(i !== arr.length / 2) {
      // 其他
      ctx.moveTo(rectW * i, rectH);
      ctx.lineTo(rectW * i, canvas.height);
    } else {
      // 只有中间贯通
      ctx.moveTo(rectW * i, 0);
      ctx.lineTo(rectW * i, canvas.height);
    }
    
    ctx.stroke()
  }

行列分开画

推荐问题