JS实现可动的svg环形进度条

老样子，先看效果图

 SVG标签

<svg width="60" height="60">
	<g transform="rotate(-90 30 30)">
		<circle id="progress-bg" cx="30" cy="30" r="25" fill="none" stroke="#dddddd" stroke-width="4"></circle>
		<circle id="progress-circle" cx="30" cy="30" r="25" fill="none" stroke="#0f4cb6" stroke-width="4"></circle>
	</g>
	<text id="progress-text" x="30" y="35" text-anchor="middle" font-size="12" fill="#0f4cb6">0%</text>
</svg>

JS代码