php svg转base64,关于svg转换在vue中（转换svg/base64）

关于svg：可缩放矢量图形，使用XMl格式定义图像。

看到此篇文章的你，已经会使用svg最基本的用法;

在网上找到了一个插件，很轻易的就可以完成：canvg

01、安装

cnpm install canvg

cnpm install canvg@2.0.0-beta.1 canvas@^2 jsdom@^13 xmldom@^0

02、引入

在需要使用的地方引入或者在main里，我用到的是当前引入：

import canvg from "canvg";

03、使用

html;

js:

在methods:{

handleChange() {

let svgXml = new XMLSerializer().serializeToString(this.$refs.elSvg);//在svg标签上 用ref=elSvg

console.log(svgXml); //处理svg传给canvg的格式(这里会输出传给后端的字段)

let canvas = document.createElement("canvas"); //页面创建空canvas

canvg(canvas, svgXml); //进行转换

let ahref = document.createElement("a");

ahref.href = canvas.toDataURL("image/png");

ahref.download = "exportPng";

ahref.click();

},

}

希望有所帮助！！

标签：canvas,vue,转换,svg,svgXml,let,ahref,canvg

来源： https://www.cnblogs.com/mm-zz/p/10785743.html