png/jpg转svg，并下载到本地 ,需要下载png/jpg就简单了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://www.qianduange.cn/upload/article/jquery.min.js&" alt="" style="width: 100px;" id="img">
<br>
<br>
<br>
<p>转换为svg：</p>
<div id="container">
</div>
<p>
<button type="button" id="download">下载svg</button>
</p>
</body>
</html>
<script>
const img = document.getElementById('img');
var canvas = document.createElement("canvas");
const width = img.width;
const height = img.height;
canvas.width = width;
canvas.height = height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height);
var dataURL = canvas.toDataURL();
var svgString = `<svg id="downloadSvg" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="${width}px" height="${height}px"
viewBox="0 0 ${width} ${height}" enable-background="new 0 0 ${width} ${height}" xml:space="preserve">
<image id="image0" width="${width}" height="${height}" x="0" y="0" href="${dataURL}"></image>
</svg>`;
$('#container').append(svgString);
function download(arg) {
var blob = new Blob([arg], {type: 'image/svg'});
var href = window.URL.createObjectURL(blob);
var a = document.createElement('a');
a.href = href;
a.download = 'download.svg';
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(href);
}
$("#download").click(function () {
download(document.querySelector('svg').outerHTML)
})
</script>
