html5 svg绘制笔画书写汉字动画特效

js代码

<script src="js/hanzi-writer.min.js"></script>
<script src="js/polyfill.min.js"></script>
    <script>
        var char = '向往自由人生',writer = [];
        for (var x = 0; x < char.length; x++) {
            writer.push(writeChar(char[x]))
        }
        function writeChar(char) {
            return HanziWriter.create('character-target-div', char, {
                width: 100,
                height: 100,
                padding: 5,
                showOutline: true
            });
        }
        document.getElementById('animate-button').addEventListener('click', function () {
            if(writer.length > 0){
                writer.map(function(w){
                    w.animateCharacter()
                })
            }
        });
    </script>