数据可视化

🎨用 fabric.js 创建画布时，fabric.js 会在 canvas 元素外包一层 div 容器。 如果想方便设置容器样式或者想通过 js 控制该容器，可以先给容器一个类名

🧣 fabric.js 在出厂时就提供了几个基础图形，比如矩形、圆形、三角形等。 但这些图形可能不能满足日常开发，我们可能还需要一些自定义的图形。

🍟当两个元素有部分重叠时，选中底层元素后，想通过被盖住的部分移动元素，该如何实现？实 Fabric.js 已经提供了相应的 API 去完成上面的需求了

🐸 使用 fabric.js 创建出来的画布默认是不能拖拽移动的，不过我们可以利用一些小技巧让画布具有被拖拽的能力。

😼在 fabric.js 里要想实现拖拽画布等效果，可以使用变换视窗的方式去实现，fabric.js 提供了 viewportTransform 方法可以完成这个需求。

🎈 使用 fabric.js 创建的图形，默认的缩放原点是元素操作点的对角点。如果想将默认缩放操作设置为“中心缩放”，只需将 centeredScaling 属性设置为 true 即可。

🎁框选是 fabric.js 默认提供的一种操作，框选动作是通过“选框”的方式展示的。本文讲解如何自定义框选样式。

🥇 如果你的项目使用到 fabric.js ，可以直接使用 fabric.js 提供的方法去遮盖画布，用法非常简单。

😼如果希望元素不会超出画布，就算超出了也会弹回画布里，不妨试试本文的方法：根据画布的宽高和元素的尺寸进行计算

😡 fabric.js 为我们提供了很多厉害的方法。今天要搞明白的一个东西是 canvas.interactive

在 fabric.js 提供的文本组件中，默认状态是不会自动换行。如果你的使用场景中需要自动文本自动换行，可以使用 Textbox ，并将 splitByGrapheme 设置为 true

🐻在单页面应用中需要注意生命周期问题，比如使用 `fabric.js` 创建的画布，如果不做缓存页面，在离开页面前最好把画布销毁掉。本文就介绍一下如何销毁 fabric.js 实例

🐸 不管是做游戏还是做普通网页，在这个时代基本都离不开动画。说到动画，第一个联想到的概念就是“帧”。Three.js 提供了一个性能检测工具 Stats 可以监测帧率、内存等数据变化~

🎉 本文主要讲解使用 AntV G6 实现 拖拽生成节点 的功能。 AntV G6 是一个图可视化引擎。它提供了图的绘制、布局、分析、交互、动画等图可视化的基础能力。

渲染阴影效果需要消耗一定的资源，所以 Three.js 默认是关闭阴影效果的。 想要在 Three.js 中实现阴影效果，只需记住本文要讲的几个点即可。

简单的动画可以提高 Three.js 初学者 的学习兴趣和信心。 本文会从初学者的角度出发讲解几个简单的动画，包括：平移、旋转、缩放、跳跃。

✨ 千万不要觉得使用Canvas开发滤镜很复杂。说白了它就是在操作每一个像素点，按照你的规则去重新配色

✨ 别只是懂Vue和React了，原生的东西也赶紧学起来吧。SVG在前端的地位越来越高，它能轻轻松松做出CSS难以做到的特效 ✨

技术一直在演变，在网页中使用 SVG 的方法也层出不穷。每个时期都有对应的最优解。 所以我打算把我知道的 7种 SVG 的使用方法列举出来，有备无患~

✨ 在前端领域，如果只是懂 `Vue` 或者 `React` ，未来在职场的竞争力可能会比较弱。 根据我多年在家待业经验来看，前端未来在 `数据可视化` 和 `AI` 这两个领域会比较香。