图片水印使用svg

考试系统需要在试卷中添加水印背景，文本为学员姓名，倾斜并重复铺满试卷背景，此处选择svg做图片处理

const svgStr = `<svg xmlns="http://www.w3.org/2000/svg" width="400" height="300">
                  <text x="0" y="200" 
                    text-anchor="middle" 
                    fill="#ccc" 
                    fill-opacity="0.3" 
                    transform="rotate(-45, 30 0)" 
                    style="font-size: 30px;"\
                  >{content}</text>
                </svg>`
const watermark = `url("data:image/svg+xml;base64,${window.btoa(unescape(encodeURIComponent( svgStr.replace(/\{content\}/g, watermarkName) )))}")`
document.querySelector('.examPaperView').style.backgroundImage = watermark