Web Chart工具库

最新推荐文章于 2024-05-25 09:41:19 发布

天阴雨湿

最新推荐文章于 2024-05-25 09:41:19 发布

阅读量694

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： chart chart tool chart工具

本文链接：https://blog.youkuaiyun.com/HatOfDragon/article/details/98071785

前端专栏收录该内容

3 篇文章

订阅专栏

本文介绍了几个常用的Web图表库，包括Echarts、G2、D3.js、FusionCharts、Google Chart、Chart.js和HighChart。这些库基于canvas或SVG，提供了丰富多样的图表类型，满足不同数据可视化需求。Echarts和G2来自国内，适合2D图表；D3.js功能强大，适用于复杂图表；FusionCharts设计精美，支持90多种图表并兼容低版本IE；Google Chart和Chart.js简洁轻便；HighChart则提供丰富的图表选项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

最近工作中需要实现数据统计面板，需要使用chart工具库，于是开始搜集有关chart工具库的情报，整理如下

工具库

Echarts
这个库相信大家都不陌生，国内非常常见的chart库，基于canvas，目前常用版本是2和3。图的类型比较齐全，样式比较简约，可以自定义主题。使用方式可以见官网，如果你使用的是React，你可以看看我的另一篇博客。
G2
这是国内的另一个chart库，是由蚂蚁金服实现的。图表基于canvas，类型比较丰富，这个库仅包含2d图表，如果你需要其他的图表，可以去查看蚂蚁金服提供的另外两个库: G6 图可视化引擎和 L7 地理空间数据可视化。
D3.js
这是国外的一款非常强大的chart库，基于SVG，图表比较复杂且齐全，如果你的需求很复杂，可以考虑使用它，浏览器支持到IE9+。
FusionCharts
- 当我第一次看到这个库的时候，老实说我被惊艳到了。它的设计简约精美，充满设计感。图表非常丰富，拥有超过90种图表，对于普通开发者或者公司来说免费版就已经足够了，官方文档也非常有条理并且详细，感觉开发者有洁癖（不过我喜欢）。FusionCharts基于SVG，值得一提的是，这个库竟然支持IE6 !!!
- 这个库有免费版和收费版，免费版会产生水印，在chart的左下角会有FusionChart Trial字样，免费版不可商用，如果个人使用的话，悄悄地告诉你可以自己想办法去除水印，毕竟是基于svg的。
Google Chart
顾名思义，这个库是Google开发的，整体图表样式比较简单，种类也比较多，同样也是基于SVG的。
Chart.js
这是一个非常小的库，基于Canvas。如果你只需要简单的条形图或者线形图，你可以选择它，它的特点就是小，同样也是它的优势。
HighChart
有人说这个库和FusionCharts差不多，图表比较丰富，同样基于SVG。