不过目前只通了使用线上svg的传参方式,还支持本地svg的方式以及传递svg的代码的方式,不过还没尝试通 html块
用到的插件地址:canvg.js.org/
<canvas id="canvas"></canvas>
js块
<script type="module">
import { Canvg } from "https://cdn.skypack.dev/canvg@^4.0.0";
start();
async function start() {
const canvas = document.querySelector("canvas");
const ctx = canvas.getContext("2d");
const v = await Canvg.from(ctx, "https://canvg.js.org/img/logo.svg");
// Start SVG rendering with animations and mouse handling.
v.start();
window.onbeforeunload = () => {
v.stop();
};
}
</script>
实现效果: