下载得到的svg转为png下载

该代码示例展示了如何使用Canvg库将SVG转换为PNG。它首先创建一个画布,然后利用Canvg从SVG字符串渲染到画布,接着将画布内容转化为数据URL,最后下载为PNG图像。
摘要由CSDN通过智能技术生成
import { Canvg } from 'canvg';
//svg转png
let v = null;
export function svgToPng (svg: any) {
    //创建画布
    const canvas = document.createElement('canvas');
    const ctx = canvas?.getContext('2d');
    if(ctx){
        //使用fromString方法读取SVG字符串的Canvg
        v = Canvg.fromString(ctx, svg);
        //开始在画布上绘制SVG
        v?.start();
        //将画布转换为图像
        const img = canvas?.toDataURL("img/png");
        let a = document.createElement("a");
        a.style.display = "none";
        document.body.appendChild(a);
        a.href = img;
        a.download = "diagram.png";
        a.click();
        window.URL.revokeObjectURL(a.href);
        document.body.removeChild(a);
    }
    
  }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值