需要将svg转换成base64的jpg/png
/** * * @param {string} fileName 下载的文件名 * @param {string} fileType 需要转的文件类型 png/jpg * @param {string} svgstr 输入svg */ function parseSvg(fileName, fileType, svgstr) { // 1、创建img var img = document.createElement('img') // 2、svg转base64 img.setAttribute('src', 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svgstr)))) // 3、转指定格式 img.onload = function() { // 1、创建canvas var canvas = document.createElement('canvas') var context = canvas.getContext('2d') canvas.width = img.width canvas.height = img.height // 2、根据base64生成canvas context.drawImage(img, 0, 0) // 3、canvas转字符串 var canvasData = canvas.toDataUrl("image/" + fileType) // 此时的 canvasData 已经可以作为 img 的 src 进行png图片渲染 ,可以直接 return canvasData 得到: ‘data:image/png;base64,......’ // 4、如果需要下载 /* var imgDownload = document.createElement('img') imgDownload.setAttribute('src', canvasData) imgDownload.onload = function() { var a = document.createElement('a') a.download = fileName + '.' + fileType a.href = imgDownload.getAttribute('src') a.click() } */ } }
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· C#/.NET/.NET Core技术前沿周刊 | 第 29 期(2025年3.1-3.9)
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异