它与 API 非常相似。 许多公司免费使用它，但实际上它们有许多独特的功能。 最突出的是-gl，可以实现三维图表和地球的显示。 其他开源库基本没有，其他商业图表都是基于SVG的，只能模仿3D效果。 只有-gl基于WebGL实现真3D，可配置光照、材质、阴影等，拥有专属后期特效。
-gl主要是因为我第一次听说的时候他写了自己的WebGL框架（以前叫qtek）。 作为一个WebGL新手，一直不明白为什么要自己抄一个。 这件事我是后来才知道的。 框架并不简单。
学过3D图形后，知道常见的渲染架构有两种，一种是前向渲染，一种是延迟渲染。 一般来说，前向渲染更容易实现，但不能支持大量光源，延迟渲染实现成本更高。 高，但支持大量光源，适合做后期特效，所以包括Unity和4在内的主流游戏引擎主要使用延迟渲染，只有在低端设备上才切换到前向渲染。
但是，如果你四处搜索，你会发现在WebGL领域，它是唯一支持延迟渲染的，包括Three.js（尝试过但放弃了），.js，还有你闻所未闻的各种WebGL引擎. 光源的数量将受到限制，例如最多 4 个。
除了延迟渲染的独特亮点外，它还内置了Bloom、SSAO、SSR等特效，并支持动画、GLTF等，是为数不多的功能齐全的WebGL框架之一。
正是因为对3D图形的深入理解，-gl才能产生远超其他图表库的效果。 然而，这个巨大的门槛既是优势也是劣势。 -gl最大的问题是，懂WebGL的前端工程师太少，再加上使用自研渲染引擎导致门槛较高。 这个项目很久以来只有一个人提交过。 最近给地球添加了一个小特效，成为了第二个贡献榜。
作为公司内部的开源产品，在功能和文档方面已经达到了商业产品的水平。 还有主题编辑和社区贡献的大量案例，7年来团队一直在投稿，不易。 计划中的新5.0版本将在动画、数据处理和性能上有明显的提升，值得期待。
Vega - 图表库也可以是低代码的
Vega 和 D3 都来自华盛顿大学的数据实验室。 该机构专注于数据交互的研究，Vega的目标是做数据可视化配置语法。 你可以基于它准备各种想要的元素，比如axis,等。/的图表虽然主要依赖一个配置项，但是仍然需要依赖代码来加载数据，而Vega可以完成所有图表相关的开发只有JSON，包括数据加载、转换、交互等。
例如下面的例子加载一个csv文件，然后添加一个计算字段，这个字段取自原始数据中两个字段的差异。 这里的数据加载和处理需要在其他图表库中编写实现：
{
"data": {"url": "data/seattle-weather.csv"},
"transform": [
{"calculate": "datum.temp_max - datum.temp_min", "as": "temp_range"}
]
}
但是因为它追求的是完全的可配置性，所以要实现一个最基本的图表需要大量的配置。 比如最简单的直方图需要95行的配置，很容易吓跑不耐烦的初学者，于是Vega又做了一个。 高级语法Vega-Lite，但同样更注重灵活性而不是易用性，默认不提供交互功能。 如果不配置，鼠标移到图表上没有反应，让人误以为是静态图片。 ，所以整体上对初学者并不友好，无法立即制作出完整可用的图表。
Vega 方法的独特优势在于它可以促进程序生成。 例如，Vega 团队开发了它。 它的原理是动态生成Vega配置，所以很容易成为其他语言的前端图表生成工具。
单从视觉语法的角度来看，Vega 做得很好，提供了很多新的思路。 比如它不像D3那么底层，但是它提供了一个更容易上手的可视化领域的基础设置，让即使不会的人也能使用它，非常适合分析人员使用. 但是，Vega 也有明显的缺点，我们将在本文最后说明。
PS Vega的图表加载、转换、展示、交互的思路只需要JSON配置，这和我们的开源项目amis非常相似，无需编写即可完成中端页面的开发。 G2/F2 - The Of 的追随者
G2由支付宝前端团队开发。 虽然当时已经很成熟了，但是支付宝还是选择了自己做一个，这就是G2的前身。 其API与支付宝基本相似。 后来笔者看了《The Of》这本书，调整了方向，开始按照这本书的思路开发G2。 这个G2的名字就是本书书名中的两个G。
受本书影响的可视化库有很多。 上面提到的Vega-Lite在作者的论文中提到了很多。 像 G2 一样，也有参考那本书的图表部分，但不要阅读它。 这是微软的一个项目。 实际上只有一个人在开发，投稿数量很不稳定。 笔者还忙于另一个比较知名的项目react-dnd，所以以后大概率会被弃用。
在《The Of》中，作者主要借鉴了面向对象的思想，将图表拆分成数据源、数据转换、坐标系、图形等诸多组件，通过把它们组装起来，从技术角度来说并不新鲜，但是这本书在数学上进行了结合和分析，看起来很高级。
奇怪的图表.().('genre*sold'); in G2 来自那本书。 这里的*不是乘法，而是作者自己定义的一个运算符，也就是合并的意思。 支持运算符重载，所以这里只能使用字符串，类型信息丢失，很容易在不知情的情况下拼错。
与同类图表库相比，G2的定位更接近Vega，即比直接使用的图表库低一层。 对于想用的人来说，会觉得上手成本比较高，所以后来的G2也提供了更加简化的绘图，专注于常用的图表。
我从来没有真正使用过这个项目。 我在文档和示例方面做了很多工作。 已经达到了商业项目的水平，可以满足大部分需求，但是从提交历史来看，有点不稳定。 F2在2019年停滞了好几个月，G2的提交数量也明显减少，最近六个月才回升，可能是内部重构的原因。
值得一提的是，蚂蚁V团队也开发了很多方向，比如关系图G6/X6、图L7、自动选图AVA等，但这些项目大多只有一个人，团队的精力可能是一个有点散。
Chart.js - 热门促销示例
之前我对 Chart.js 库了解不多。 几年前我第一次发现它时，它的星星数量非常多。 现在star数49.3k，在npm上的周下载量已经达到百万。 它与D3处于同一数量级，可能是最流行的前端图表库。
既然如此火爆，它的技术情况如何呢？ 该项目最早投稿时间为2013年，近7年投稿从未中断。 但是整个项目的代码量只有1w多行。 它的图表类型和可配置项很少。 总体来说，比/差太多了。 看了半天，真的不明白为什么这么受欢迎。 可能反映出大部分人对图表的要求并不高。 可以展示几个场景图，一点交互和动画就够了。
在我看来，唯一值得关注的就是它的宣传推广能力。 它是如何变得如此受欢迎的？ 仅仅是个好名字吗？
- 小镇中的世界级组件
接下来介绍几个商业图表库。 首先，它是最知名的商业图表库，从中也可以看出：
多家商业图书馆的关注
如果不去研究，很多人可能会认为它是一家美国公司，但它其实诞生在挪威一个只有2000人的美丽小镇，而且至今还在这里。 有山有水如世外桃源：
维克我松，
2006 年，创始人只是想在他的主页上添加一个图表。 虽然有/这些Flash商业解决方案，但他看不惯就开始基于SVG/VML开发。 也许他是第一个这样做的人。 之所以后来居上，很可能是因为使用SVG/VML最大的优势就是方便前端使用，但是之前基于Flash的解决方案和沟通上的麻烦往往会导致整个开发page with Flash，比较贵，所以后来/也转向了SVG/VML方案。
十四年过去了，它的创始人几乎每天都在提交代码。 这个项目的很多贡献者都是同乡的，而且大部分都是他培养的老乡。 . .
虽然是开源的，但是商业使用是需要收费的。 很多人看到要花钱并不看不起，但实际上，专攻这一领域的商业公司往往更有优势。 D3 最好的开源图表库是一家商业公司的产品。
作为商业公司，如果有收入，可以雇佣很多人一起发展。 目前全公司有36人。 这从历史上就可以看出来。 它有超过14人贡献了超过1w行代码，其中大部分是连续提交超过5年，这是所有其他免费开源项目不可能做到的。 比如最火的D3，主要是一个人贡献的，很可能因为其他事情忙得没空维护，即使是大公司也是如此。 不管公司有多大，这个开源项目都不是公司的主营业务，所以最多只会有3-4个全职开发人员。 多了就有点倒闭了。 很容易因为团队调整、人员流失而导致项目受损。 停滞不前，我也听说过有人炒币发了大财，然后就辞职了。
如果你的项目很重要，预计未来要维护十年，还是选择成熟的商业软件比较稳妥，但我觉得它的默认样式很丑，而且这么多年都没有改过。 可能是小镇太难找设计师了。
- 低沉钱的图表库
如果你想使用商业软件但觉得它太难看，它是一个不错的选择。 也是开源的，但是商业使用要收费。 它的整体设计更漂亮，但其影响力远不及此。 就连网上的Star也只有248，还不如很多个人发布的玩具项目。
但是在国内一个卖控件的网站上，.
它成立于2003年，是这里唯一的一家美国公司。 最早的版本是 Flash。 2007年也用在了APEX产品上，整体代码量达到了30万行，生成的定义有3万行。 它在数量上碾压其他免费开源库。 从这一点，我们也可以看出商用产品在人力投入方面的优势。 但由于开发时间较长，其组件系统仍沿用。 现在应该没有人知道它是什么了。 （要知道，你已经不年轻了……），但在当时是个不错的选择。
除了图表库，它还开源了底层图形库，支持SVG/VML的输出，同样，这个库是BSD协议下的，Star数是项目的3.7倍。
- 高中生的逆袭
来自印度，其创始人的父亲是一名网页设计师，因此很早就接触到了互联网。 16 岁时，他会用 Excel 做高中作业。 在使用过程中，他觉得Excel中的图表不太好用。 ，于是贡献了一篇文章如何正确挑选网站前端框架，提出Flash不仅可以做小广告，还可以实现交互式图表的想法。 这篇文章给他带来了1500$的零用钱，而普通高中生拿到的零用钱大多会迅速挥霍在朋友圈，17岁（2002年）拿着钱成立公司，开始开发Flash基于图表库。 但是，高中辍学创业，没有投资人，也不是一件容易的事。 我会相信一个还没有成年的孩子。 一个人在家发展了三年，我招了第一个人。 早期只在网上卖，因为网上不容易发现你是小孩。 如果你知道了，你肯定不敢买。 幸运的是，在图表方面的需求非常旺盛，所以公司不断壮大，图表库不仅卖给了很多公司，还卖给了美国联邦政府如何正确挑选网站前端框架，连美国总统都在用。
没有开源，使用底层图形库。 早年有提供开源版本，后来不再提供了。 全公司65人，人多优势还是很明显的。 图表数量超过100个，文档也很详细。 All 代码提供了React、Vue等十几个框架下的示例，还提供了示例和导出PDF等功能。
另外还有一个相关的图表库是开源的，是2018年新发布的，不清楚他们之间是什么关系。 它可能是赞助商，因此文件已被刊登广告。
然而，这家公司在今年 3 月被软件公司 Idera 收购。 疫情期间我把公司卖了。 希望不是因为困难。 出售后不久，印度宣布封锁 21 天。 大公司应该可以。 更容易度过这场危机。
值得一提的是，Idera 拥有众多知名的开发工具和库，例如曾经压倒微软的 /C++ 开发工具，早年震惊前端界的 Ext JS，必装扩展，大名鼎鼎的 CI tool Cl, good 一个可以使用的富文本编辑器。 - 唯一免费用于商业用途的商业图表库
它也来自一个小国家。 其总部位于立陶宛。 一开始只做地图和图表，后来做饼图和折线图。 应该是这里最小的商业公司了。 整个团队只有7个人，其中4-5人左右，因为人少，所以功能比其他几个商业库要少，比如不支持vml（但现在IE8没人用），可能是因为觉得做不到，所以采取了不同的经营策略，唯一的商业用途是免费的，去掉logo只需要付费。 这个策略似乎运作良好。 它的搜索量在这些商业数据库中排名第二，使用的网站数量仅次于它。
Chart - 图表库云服务
它是2008年推出的，做的很早。 虽然在国内没有人用，但是在国外用的很多。 根据一项数据分析，它是最受欢迎的图表库，其在网站中的使用量是网站的两倍。
有两个版本，一个是通过链接生成图表图片，一个是外链图表库。
通过链接生成图表图片的做法在十多年前就很普遍了。 比如在性能监控领域应用多年。 甚至现在在一些股票网站的k线图中也能看到这种方法。 使用它的主要原因是当时前端技术不成熟，浏览器兼容性差。 使用这种方法，您可以轻松地在所有浏览器中获得一致的显示效果。 这是一个例子：
还有一个好处是使用方便，可以通过拼字符串生成图表，可以很方便的放入邮件中，但是这种方法的缺陷也很明显，就是不支持交互，你不能鼠标悬停查看具体数值，尤其是数据点多的折线图，更是无能为力，2012年宣布放弃这项服务。
魔力象限中排名第三的BI厂商Qlik，依旧是通过生成图片来展示图表。 究其原因，可能是技术发展太早，历史包袱太重，改不了。 这家公司早在1993年就成立了，当时浏览器的始祖刚刚发布，能显示图片是独家技术，浏览器的诞生还要再等两年，所以在那个年代，在浏览器中显示图表的唯一方式就是动态生成图片。
外部链接是目前使用 Chart 的唯一途径。 这样做的好处是可以随时更新。 缺点是文件加载性能依赖CDN。 这也导致在国内几乎没有人使用，似乎进入了维修状态。 它已在最近几年进行了更新。 非常慢，一年只有2次更新。
其他开源图表库
Star数比较高的开源图表库很多。 这是一个简短的总结：
概括
虽然有很多开源图表库，但大部分要么已经被废弃，要么将被废弃。 目前可以使用的只有 Ploty.js、Vega 和 G2。
Vega的背后是一个学术组织。 投资相对稳定，但缺点是可能更注重学术方面的发展。 一些在行业中很重要但没有技术含量的东西不是很关心，比如主题配色、动画、阴影、波纹等，花里胡哨的优先级一定是最低的。 比如动画功能据说是2016年做的，前几天作者说有很多功能他想做。 动画留给我的学生先研究。 所以Vega只推荐内部使用，外部产品还是需要一些花里胡哨的东西。
Ploty.js背后有一家公司专门做这个，代码提交比较稳定。 不过，作为一家商业公司，似乎主要还是靠销售另一种开源的 Dash 产品和咨询服务。 不知道以后会不会对高级图表功能收费。 目前，了解图表库的人并不多，npm 上的下载量也很低。
G2虽然身处大型互联网公司，但实际的人力投入是很难与专门从事这方面的商业公司相提并论的。 G2战队的情况我不太了解。 相对来说，社区更强大，依赖用户贡献的例子就差远了。 远超其他图表库，在一定程度上减轻了API的学习成本，几乎全部回复。 没有多少开源库可以做到这一点。
以后会有更好的前端图表库吗？ 恐怕不是。 上面提到的许多图表库的成功赶上了技术变革。 从最早的/Flash，到SVG/VML，再到最新的，技术栈的不同使得它们一出来就具有明显的优势。 因此，如果没有新的技术变革，新的图表库很难超越，只能在特定领域有所突破。 目前只能看到浏览器接下来的图形技术变革，虽然不会那么惨，但是和WebGL相比，它的主要优势在于减少了CPU的时间，更好的利用了GPU，更利于后续游戏在浏览器上的表现，但是对于图表来说相比WebGL并没有明显的优势，再加上图表大多是二维的，除非数据点非常多，否则并行渲染的好处不大。
图表库的商业产品不多。 毕竟这个要求很笼统，很难在比赛中做到差异化。 这对客户来说是昂贵的。 为什么不选择最好的呢？ 此外，追赶商业品质的开源库的存在可以满足大部分需求，使得商业产品的生存空间有限。
如果选择商用产品，国内最好选择 , , , , 因为目前好像还不支持中文，不过需要注意这些产品的图。 有错误，把某个省当成了国家，用的时候要改。
最终，我们选择了我们的BI产品，因为它的全面功能为我们省去了很多工作。 实践证明，在BI等复杂的图表场景下使用是没有问题的。 通常用户想要我们还不支持的东西。 函数，我们去文档里找，发现是有的。 . . 非常感谢团队多年来的奉献精神。
上面提到的图表库都需要开发好才能用于可视化分析。 如果不想开发，可以选择完整的可视化平台。 我们将在下一篇文章中介绍。 如果您有兴趣，请关注。
