1、SVG实现的圆环旋转效果
参考：http://www.softwhy.com/article-6472-1.html
2、SVG中的图形可以通过 transform="matrix(0,-1,1,0,0,440)"进行旋转。
3、svg代码可以单独放在一个后缀名为 .svg 的文件中保存起来。这个文件就是矢量图片文件。
这点用来制作一些矢量图会非常方便，不需要把这个svg代码放在html了（比较乱），可以单独在一个svg文件中。代码逻辑会清晰、干净许多。(占位代替图会经常使用svg制作)
SVG标签学习（SVG标签在W3C中是排在xml中学习的）： http://www.w3school.com.cn/svg/svg_circle.asp
SVG在线制作编辑预览工具：https://www.bejson.com/ui/svg_editor/
SVG WEB在线编辑器 ： http://www.86y.org/demo/svg/（这个不能把图片保存为svg文件） 或 http://www.zuohaotu.com/svg/（推荐，这个比较完美）
canvas
1、canvas标签在使用的时候，内部就会创建一个画图的对象（getContext("2d") 或getContext("3d")）。挂载在这个canvasDOM对象上。
js中可以直接获取这个DOM对象对应的画图对象ctx。
2、通过这个ctx对象，描述画什么样的图画。
3、使用stroke() 或者 fill() 方法把ctx描述的图画呈现出来。
注：上面的2、3步骤可以合并在一起，步骤2的描述可以作为步骤3（步骤3API的变形）的参数。如，fillText(text,x,y) 或 strokeText(text,x,y)。
总结：canvas在js使用分3个步骤：获取canvas标签的DOM对象，从DOM对象中取出画图对象ctx；使用画图对象ctx描述所画的图像；将描述的图像呈现从来。
画图对象ctx常用的API：https://www.cnblogs.com/liugang-vip/p/5360283.html