vue中使用 canvas给页面添加水印

最新推荐文章于 2024-05-13 04:11:33 发布

不能懒鸭

最新推荐文章于 2024-05-13 04:11:33 发布

阅读量812

点赞数

分类专栏： vue2.0 javascript 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/m0_45382009/article/details/123036076

版权

本文介绍如何在Vue.js项目中封装一个公共方法，用于给页面动态添加水印。通过javascript技术，实现在前端展示内容时添加自定义水印效果。

摘要由CSDN通过智能技术生成

封装公共添加水印的方法:

//  utils/watermark.js

/**入参：
	@text: 传入水印需要展示的文本;
	@renderDom:要给哪个元素加水印，默认body；
*/
var watermark = {
   }
var setWatermark = function(text,renderDom=document.body){
   
    var id = '1.23345566.3333344';
    if(document.getElementById(id)!==null){
   
    }；
    // 创建一个画布
    var can = document.createElement('canvas');
    // 设置画布的长宽
    can.width = 400;
    can.height=400;
    var cans = can.getContext('2d');
    // 旋转角度
    cans.rotate(-