为网站添加文字水印（canvas）

话不多说，先上图！！

//添加水印
function addWaterMarker(str){
  var can = document.createElement('canvas');
  var body = document.body;
  body.appendChild(can);

  can.width=200;
  can.height=100;
  can.style.display='none';

  var cans = can.getContext('2d');
  //水印旋转
  cans.rotate(-20*Math.PI/180);
  //画布上显示文字的大小和字体
  cans.font = "16px Microsoft JhengHei";
  cans.fillStyle = "rgba(17, 17, 17, 0.40)";
  cans.textAlign = 'left';
  cans.textBaseline = 'Middle';
  //str:画布上显示的文本；can.width/4：开始绘制文本的X坐标；can.height/2：开始绘制文本的Y坐标
  cans.fillText(str,can.width/4,can.height/2);

  body.style.backgroundImage="url("+can.toDataURL("image/png")+")";

}
addWaterMarker('冯亚婷');