Html里面渲染svga格式文件

最新推荐文章于 2023-09-26 15:18:25 发布

羊羊羊92

最新推荐文章于 2023-09-26 15:18:25 发布

阅读量1.8k

点赞数 2

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_40716786/article/details/118611397

版权

<body>

<div class='w'>
    <canvas></canvas>
</div>

<style type="text/css">
    .w{
        width: 400px;
        height: 300px;
        background: red;
    }

    canvas { width: 200px; height:300px;}
</style>
<script src="https://cdn.jsdelivr.net/npm/svga.lite/svga.lite.min.js"></script>
<script>

    function playerSvga() {

        let svgaArray ='http://xxx/car.svga'
        const canvas = document.getElementsByTagName('canvas')[0]
        const downloader = new window.SVGA.Downloader()
        const parser = new window.SVGA.Parser()
        const player = new window.SVGA.Player(canvas)
        player.set({
            cacheFrames: true,
            intersectionObserverRender: true
        })

        downloader.get(svgaArray).then(fileData => {
            parser.do(fileData).then(svgaData => {
                player.mount

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

羊羊羊92

关注关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
5
评论
Html里面渲染svga格式文件

<body><div class='w'> <canvas></canvas></div><style type="text/css"> .w{ width: 400px; height: 300px; background: red; } canvas { width: 200px; height:300px;}</style>.
复制链接

扫一扫