实现逻辑:
用canvas 绘制水印,将绘制好的canvas 转为base64码,作为背景
具体代码如下:
warterMarkMobile.ts
/** 水印添加方法 */
let setWatermark = (str1:any, str2:any,str3:any,str4:any,str5:any,str6:any) => {
let id = '1.23452384164.123412415'
if (document.getElementById(id) !== null) {
document.body.removeChild((document as any).getElementById(id))
}
let can = document.createElement('canvas')
// 设置canvas画布大小
can.width = 120
can.height = 120
let cans:any = can.getContext('2d')
cans.rotate(-30 * Math.PI / 180) // 水印旋转角度
cans.font = '12px Vedana'
cans.fillStyle = '#666666'
cans.textAlign = 'center'
cans.textBaseline = 'Middle'
cans.fillText(str1, 0, can.height - 35) // 水印在画布的位置x,y轴
cans.fillText(str2, 46, can.height - 3