FinGet

利用 vue3 + webComponent开发chrome插件，做多样式的隔离，以及怎么优化css的加载，监听dom节点的删除，并重新渲染等技巧。

数据 层次化 d3.hierarchy d3.hierarchy(data[, children]) - 从给定的层次结构数据构造一个根节点并为各个节点指定深度等属性.

力向导图是绘图的一种算法，实现了用以模拟粒子物理运动的 velocity Verlet 数值积分器。仿真思路如下: 它假设任意单位时间步长 Δt = 1，所有的粒子的单位质量常量 m = 1。作用在每

弦图，是一种表示实体之间相互关系的图形方法。直观的看，弦图由节点分段和弧形的边构成。节点分段沿圆周排列，节点之间的关系通过使用弧线或贝塞尔曲线相互连接。值得注意的是，这些弧线是有宽度的，且起止宽度可以

堆叠图是柱状图的一种形式，它显示了一些相对或绝对变量随时间变化的构成和比较。看起来像一系列堆叠在一起的柱状图。如果使用得当，堆叠图是一种非常有效的比较工具。它们旨在比较不同类别的总值。

饼图和之前介绍的柱状图和折线图不同，不存在坐标系，也就不会有比例尺的映射。在折线图的介绍中，我们提到了d3提供了一些图形构造器并了解了一下d3.line以及d3.area

本章我们来实现一下折线图，有了画柱状图的经验，我们可以快速的分析出柱状图和折线图的区别主要是x轴比例尺和绘制数据图形,其余的画布，坐标轴等，本章就不过多的讲解了。

在了解了svg和d3的基础知识以及画图最重要的比例尺，接下来就可以开始画图表了。本章我们以柱状图为例，尽可能的按照图表的绘制步骤实现下面的柱状图。

中国这么大，要在一张小小地图上画上中国，那么就需要按一定的比例缩小。D3 可视化画图，也是如此，例如：一个柱状图的最大值为10000，但是画布最大高度只有400，那么10000就只能被映射为400，那