blackteay/fes.js
1
0
Fork 0
mirror of https://github.com/WeBankFinTech/fes.js.git synced 2025-06-30 02:35:08 +08:00
Code Issues Projects Releases Wiki Activity

feat: watermark默认样式优化

Browse Source
This commit is contained in:
ocean-gao 2022-04-20 10:58:01 +08:00
parent 5fa7bb0af4
commit 4daac1c517
2 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
docs/reference/plugin/plugins/watermark.md
View File

@ -58,12 +58,13 @@ createWatermark({ content: '我是水印' });
height = '300px',
textAlign = 'center',
textBaseline = 'middle',
font = '16px Microsoft Yahei',
fillStyle = 'rgba(184, 184, 184, 0.2)',
fontSize = '14px',
fontFamily = 'Microsoft Yahei',
fillStyle = 'rgba(184, 184, 184, 0.3)',
content = '请勿外传',
rotate = '45',
rotate = '25',
zIndex = 99999,
timestamp = 'YYYY-MM-DD hh:mm'
timestamp = 'YYYY-MM-DD HH:mm'
}
```

12
packages/fes-plugin-watermark/src/runtime/core.js
View File

@ -37,7 +37,8 @@ export function createWatermark({
height = '300px',
textAlign = 'center',
textBaseline = 'middle',
font = '14px Microsoft Yahei',
fontSize = '14px',
fontFamily = 'Microsoft Yahei',
fillStyle = 'rgba(184, 184, 184, 0.3)',
content = '请勿外传',
rotate = '25',
@ -54,7 +55,8 @@ export function createWatermark({
height,
textAlign,
textBaseline,
font,
fontSize,
fontFamily,
fillStyle,
content,
rotate,
@ -68,9 +70,9 @@ export function createWatermark({
const ctx = canvas.getContext('2d');
ctx.textAlign = textAlign;
ctx.textBaseline = textBaseline;
ctx.font = font;
ctx.font = `${fontSize} ${fontFamily}`;
ctx.fillStyle = fillStyle;
ctx.translate(parseFloat(width) / 2, parseFloat(height) / 2);
ctx.translate(parseInt(width) / 2, parseInt(height) / 2);
ctx.rotate(-(Math.PI / 180) * rotate);
ctx.fillText(
`${content}`,
@ -80,7 +82,7 @@ export function createWatermark({
timestamp && ctx.fillText(
`${timeFormat(new Date(), timestamp)}`,
0,
20
parseInt(fontSize) + 5
);
let __wm = document.querySelector('.__wm');