svgdrawer : setsvg() 指令

红影

马黑黑 发表于 2024-10-19 22:43
svg动画有些复杂：

（一）原生svg动画属性繁多，想简化它非常难；

是的，黑黑之前就比较过svg动画和CSS动画，感觉还是CSS动画更容易理解且更习惯操作。能进行添加是最好的，又方便又好理解

梦江南

跟着老师学习svgdrawer : setsvg() 指令。辛苦了！

马黑黑

梦江南 发表于 2024-10-20 11:35
跟着老师学习svgdrawer : setsvg() 指令。辛苦了！

这个有点复杂的，需要先弄懂svg

马黑黑

红影 发表于 2024-10-20 11:18
是的，黑黑之前就比较过svg动画和CSS动画，感觉还是CSS动画更容易理解且更习惯操作。能进行添加是最好的 ...

CSS实现动画的原理其实和svg的差不多，只是各自实现的手段不同。

马黑黑

红影 发表于 2024-10-20 11:16
之前就试过很多，感受它的含义，现在对viewBox倒是很能理解了

其实就是坐标系的问题

红影

马黑黑 发表于 2024-10-20 17:46
CSS实现动画的原理其实和svg的差不多，只是各自实现的手段不同。

但是CSS的更熟悉点，要好很多

红影

马黑黑 发表于 2024-10-20 17:47
其实就是坐标系的问题

这个除了移动变化坐标系，还有放大或缩小，所以增加了理解难度。

马黑黑

红影 发表于 2024-10-20 23:10
这个除了移动变化坐标系，还有放大或缩小，所以增加了理解难度。

闭上眼睛就能理解缩放问题的

红影

马黑黑 发表于 2024-10-21 20:03
闭上眼睛就能理解缩放问题的

是的，仔细想想还是能明白的。

马黑黑

红影 发表于 2024-10-21 21:29
是的，仔细想想还是能明白的。

没错

红影

马黑黑 发表于 2024-10-21 21:52
没错

在脑袋中转换

马黑黑

红影 发表于 2024-10-21 23:14
在脑袋中转换

马黑黑

花飞飞

马黑黑 发表于 2024-10-22 08:24
本帖最后由 马黑黑 于 2024-10-22 08:39 编辑
    #msvg { display: block; margin: 30px 0 30px calc(5 ...

这不是成了么。。没看出哪里不正常

马黑黑

花飞飞 发表于 2024-10-22 09:34
这不是成了么。。没看出哪里不正常

要用 Promise 方法，因为论坛加载的东西多，JS出现异步运行的情况，使用 Promise 方法可以获得所需任务是否已经做好，做好的话往下一步，也是链式发展的思路。

花飞飞

马黑黑 发表于 2024-10-22 12:11
要用 Promise 方法，因为论坛加载的东西多，JS出现异步运行的情况，使用 Promise 方法可以获得所需任务是 ...

比较一下论坛里的代码多了几个然后，就是做完一件事再做下一件事的节奏 吧。。
从老师说有问题到我看到解决，看了一下花没一个小时

红影

马黑黑 发表于 2024-10-22 08:24
本帖最后由 马黑黑 于 2024-10-22 12:09 编辑
    #msvg { display: block; margin: 30px 0 30px calc(5 ...

哇，这个里面试成的。

马黑黑

红影 发表于 2024-10-22 21:15
哇，这个里面试成的。

马黑黑

花飞飞 发表于 2024-10-22 19:08
比较一下论坛里的代码多了几个然后，就是做完一件事再做下一件事的节奏 吧。。
从老师说有问题到我看到 ...

心中有成竹，就是长不大

红影

马黑黑 发表于 2024-10-22 21:25
心中有成竹，就是长不大

这句好玩