svg 学习

最近在学习 svg,写了一些 demo,记在这里,还挺有意思的。

以一张 svg 开头:

zengxiaoluan.com

d3 中的 domain 和 range

以下内容更新于 2019-06-14

最近一直在用 d3 画双通道示波器,因为不是很理解 d3 的原理,走了不少弯路,如果大家有兴趣学习 d3,可以看看这个示例,帮我们更好的理解 d3 的一些基础 API,实现我们想要的效果。

标签 text 、tspan

示例中的图形是一个正弦函数,公式如下:

$y = asin(bx + c)$

公式中的 a、b、c 如何影响图形,我就不解释了,我先回去翻一下高中课本。

See the Pen svg-text/tspan by zeng (@zengxiaoluan) on CodePen.

textPath

可以使用 textPath 实现路径动画

See the Pen svg – textPath by zeng (@zengxiaoluan) on CodePen.

线法

问大家一个问题:如何知道一个点在一个多边形里面还是外面?射线法就是专门来解决这个问题的,下面是我的 js 实现,赶着去泡脚,所以射线法是啥,我就不解释了。

以上代码有测试案例,欢迎大家在生产环境使用。

参考链接

https://www.imooc.com/video/3776/0

我要分享

曾小乱

作者: 曾小乱

喜欢写点有意思的东西

发表评论

电子邮件地址不会被公开。 必填项已用*标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据