AI+SVG的继续学习

今天尝试了一下用SVG制作动画

实现效果如下：

此主题相关图片


实际效果比这个流畅，关键的动画代码如下：

dur="8s" repeatCount="indefinite"                    rotate="auto" /

但对于动画的学习我决定到此为止，因为没有强大工具的支持（我在AI中没有找到），完全用代码去写动画那简直是恶梦，目前来说SVG的矢量动画只能是当作辅助，其动画能力应该还是不错的，但由于没有FLASH这种工具的支持，恐怕难以流行。

全部代码见附件：
此主题相关文件 161417.zip

基本图形的使用 圆，椭圆，方，长方，线，不规则图形，以及文字，大杂烩在一起使用一下： 此主题相关图片 代码也很简单：                                          stroke-width="2" stroke="blue"/>                      fill="none" stroke="red" stroke-width="3" />     清风 Breeze 关于路径的使用也很简单：          fill="red" stroke="blue" stroke-width="3" /> 此主题相关图片 OK，SVG的代码还是挺好理解，挺好掌握的，但是但是，特别复杂的图形，如果都用代码手工写，那会吐血的，所以我们的目标就是了解，然后用AI去制作图形，手工去优化生成的代码。 随便用AI制作几个基本图形： 此主题相关图片 生成的代码15.3kb，用记事本打开也会发现很乱，不过有了上面的学习基础，我们来进行一下优化。 仔细看你会发现，只要删除中的数据，那么这个svg文件与手写的就没有太大区别了。删除后的大小仅1.33kb 其关键代码也不过如下几行：                                                      清风 Breeze                                     和手工写基本一样。 OK，接下来就要学习AI制作图表了，也是SVG的强项所在。