原理:通过动态生成canvas然后转为base64格式
代码Demo
export const waterMark = (text) =>{
let _wm = document.createElement('canvas')
_wm.setAttribute('width',150)
_wm.setAttribute('height',100)
let ctx = _wm.getContext('2d')
ctx.fillStyle = '#d2d2d2'
ctx.font= "13px 宋体"
ctx.translate(60,50)
ctx.rotate(-0.5)
//ctx.fillRect()
ctx.fillText(text,0,0)
return _wm.toDataURL()
}

js动态生成水印的更多相关文章

  1. JS动态生成的元素,其对应的方法不响应(比如单击事件,鼠标移动事件等)

    主要原因:在页面给元素注册点击事件的时候[ $(function () {  XXX }); ],JS动态生成的元素还尚未生成,所以click事件就没有生效 解决方法: 方案一:js动态生成元素后再给 ...

  2. 抓取Js动态生成数据且以滚动页面方式分页的网页

    代码也可以从我的开源项目HtmlExtractor中获取. 当我们在进行数据抓取的时候,如果目标网站是以Js的方式动态生成数据且以滚动页面的方式进行分页,那么我们该如何抓取呢? 如类似今日头条这样的网 ...

  3. js动态生成数据列表

    我们通常会使用table标签来展示数据内容,由于需要展示的数据内容是随时更换的,所以不可能将展示的数据列表写死在html写死在页面中,而是需要我们根据后台传来的数据随时更换,这个时候就需要我们使用js ...

  4. 2)JS动态生成HTML元素的爬取

    2)JS动态生成HTML元素的爬取 import java.util.List; import org.openqa.selenium.By; import org.openqa.selenium.W ...

  5. qrcode.js 动态生成二维码

    用qrcode.js动态生成二维码图片非常简单,只需要引入qrcode.js即可使用,而且可以自定义图片大小.背景色等信息. 1.jsp代码---页面头部引入qrcode.js,jquery文件可选 ...

  6. js 动态生成html 触发事件传参字符转义

    通常,在使用 JS 动态生成 html 的过程中,会嵌入相应的样式.事件等属性元素,而这时经常会出现所谓的 “单.双引号不够用” 的情况,别急,这时可以利用 html 语言中的转义字符来解决.下面就来 ...

  7. 爬虫案例(js动态生成数据)

    需求:爬取https://www.xuexi.cn/f997e76a890b0e5a053c57b19f468436/018d244441062d8916dd472a4c6a0a0b.html页面中的 ...

  8. JS 动态生成JSON对象

    JS 动态生成JSON对象,一般用到JSON传递参数的时候,会用到. function onGeneratedRow(columnsResult) { var jsonData = {}; colum ...

  9. 抓取js动态生成的数据分析案例

    需求:爬取https://www.xuexi.cn/f997e76a890b0e5a053c57b19f468436/018d244441062d8916dd472a4c6a0a0b.html页面中的 ...

随机推荐

  1. 破解 jeb 2.3.7 demo

    前言 使用的技术和上文的一样. mips 版本的修改版 修改版: https://gitee.com/hac425/jeb-mips 正文 安卓版 jeb-2.3.7.201710262129-JEB ...

  2. oracle 和 mysql 和区别

    1.mysql 有枚举类型,oracle 没有; mysql不支持number.varchar2类型,报错.2.oracle 支持全外连接,mysql 不支持 select e.ename, e.sa ...

  3. 线性代数的视角理解LSR(least square regression)的参数评估算法本质

    https://medium.com/@andrew.chamberlain/the-linear-algebra-view-of-least-squares-regression-f67044b7f ...

  4. eclipse导入spring aop xml约束

    步骤: 1. 2. 3. 4.取  Location:中最后一个命名:spring-aop-4.2.xsd,放到Key的最后面,Key type:选择 Schema location.点击OK 5.编 ...

  5. 纲举目张:打通MySQL架构和业务的任督二脉

    目前,在很多OLTP场景中,MySQL数据库都有着广泛的应用,也有很多不同的使用方式.从数据库的业务需求.架构设计.运营维护.再到扩容迁移,不同的MySQL架构有不同的特点,适应一定的业务场景,或者解 ...

  6. 定制选择范围的按钮RangeButton

    定制选择范围的按钮RangeButton 效果: 源码: RangeButton.h 与 RangeButton.m // // RangeButton.h // PulsingView // // ...

  7. Ubunt16.04下安装PHP7+Nginx+MySQL

    本文通过Ubuntu PPA来安装PHP7.   1.添加PPA $ sudo apt-get install python-software-properties software-properti ...

  8. Excel截取特定字符后面的值

    应该用到三个字符串函数:LEFT.RIGHT.MID 1.LEFT函数: 用法:LEFT(要提取字符所在单元格,从左侧开始提取的个数) 例如:=LEFT(A1,2) 意思是从A1单元格提取前两个字符. ...

  9. 我的第一个springboot应用+maven依赖管理

    第一步:使用Eclipse创建maven工程SpringBootFirst:工程目录如下 第二步:编写依赖文件pom.xml <project xmlns="http://maven. ...

  10. python面向对象-封装and多态

    python 接口类和抽象类 为什么讲封装之前要将这个东西? 我才不会说为什么 首先: python没有接口类这个概念!!!!!!!! 哈哈哈......神经病 python抽象类和接口类更接近于一种 ...