CSS或jQuery / JavaScript椭圆/圆角方形进度条

Question

关于一个示例，我已经搜索了很长时间，但是有人可以建议任何步骤或实现以下进度条的最佳方式here吗？

它基本上是一个方形路径，其边缘沿着红色区域的逆时针方向移动（进度条为红色）。我已经看到了一些径向CSS / jQuery示例，但它们相似但不适合形状的目的。中心空间将有一个百分比区域。

非常感谢任何关于从哪里开始的建议。

亲切的问候，

Answer 1

我意识到我可以使用HTML Canvas来实现这一点，我只需要为它设置动画。