<script type="text/javascript" src="https://rawgit.com/onilabs/stratifiedjs/master/stratified.js"></script> <script type="text/javascript" src="https://rawgit.com/kimmobrunfeldt/progressbar.js/master/dist/progressbar.js"></script> <style> #container { width: 100%; height: 10px; } #container > svg { width: 100%; height: 5px; display: block; } </style> <div id="container"></div> <script type="text/sjs"> var circle = new ProgressBar.Line('#container', { color: '#FCB03C' }); for (var i=1; i<26; i++) { console.log('Step %s',i); circle.animate((Math.sqrt(i)/Math.sqrt(25))); hold(500); } </script>