vue中后台管理中使用水印

先安装水印插件

npm install --save watermark-dom 

 然后在全部页面应用  AppMain.vue

 

 在echarts图中添加水印

        var chartDom = document.getElementById("main");

        var myChartA = echarts.init(chartDom);

        var option;

        // //绘制水印

        // const waterMarkText = “水印内容”;

        // const canvas = document.createElement("canvas");

        // const ctx = canvas.getContext("2d");

        // canvas.width = canvas.height = 100;

        // ctx.textAlign = "center";

        // ctx.textBaseline = "middle";

        // ctx.globalAlpha = 0.2; //透明度

        // ctx.fillStyle = "#72A0FF"; //字体颜色

        // ctx.font = "14px Microsoft Yahei"; //字体大小样式

        // ctx.translate(50, 50);

        // ctx.rotate(-Math.PI / 4);

        // ctx.fillText(waterMarkText, 0, 0);

        option = {

          //   backgroundColor: {

          //     //在背景属性中添加

          //     type: "pattern",

          //     image: canvas,

          //     repeat: "repeat",

          //   },

        }