const showText = 'DEFAULT WATERMARK';
export default function addWaterMark(
background = '#ffffff',
font = '20px 黑体',
) {
const cw = document.createElement('canvas');
cw.id = 'watermark';
cw.width = 160;
cw.height = 100;
const ctx = cw.getContext('2d'); // 返回一个用于在画布上绘图的环境
ctx.clearRect(0, 0, 160, 100); // 绘制之前画布清除
ctx.font = font;
ctx.rotate(-20 * Math.PI / 180);
ctx.fillStyle = 'rgba(100,100,100,0.1)';
ctx.fillText(showText, -20, 80);
ctx.rotate('20*Math.PI/180'); // 坐标系还原
const img_src = cw.toDataURL();
const antArr = document.getElementsByClassName('innerContent');
for (let i = 0; i < antArr.length; i += 1) {
document.getElementsByClassName('innerContent')[
i
].style.background = `${background} url(${img_src})`;
}
}
codepen =>>>>> codepen