SVG互动排版公众号图文『路径动画与描边动画』模板代码

模板代码

<section style="overflow: hidden;line-height: 0;" data-author="公众号：懂点君">
    <!-- 内容区域 -->
    <section style="height: 0;" data-author="公众号：懂点君">
        <svg viewBox="0 0 1000 4300" style="display: block;width: 100%;background: #fff url(https://mmbiz.qpic.cn/mmbiz_png/JpraGu7eGqRph4APkfFswMI0G9ibxF0r4sf6aWkiaUOBPz715ZUZShET7wjMMciahpoXZIyfOlxsE6Tyn99JKA2Mw/0?wx_fmt=png) center center no-repeat;background-size: 100% 100%;vertical-align: top;weixin: dong_dian_jun;pointer-events: none;">
            <!-- 从(574.8, 755)坐标开始画起；3815.56为路径总长；-->
            <g transform="translate(574.8 755)" stroke-dasharray="3815.56,3815.56" stroke-dashoffset="3815.56" data-author="公众号：懂点君">
                <!-- 实现绘制路径动画的效果 -->
                <animate attrib