核心关注指标：

1. 好看吗？
2. 支持多少数据，性能如何，内存占用如何？
3. 开发活跃度
4. 能否交互
5. 是否支持 react
6. 渲染后端是什么，基于 SVG 还是 canvas 还是 HTML？
7. License，GPL 的不能要
8. 支持绘制图形的种类
9. API 是否足够简单，友好。

其中标注 * 的是我个人比较喜欢的

综合

1. Vega Vega 很全面，几乎包括了所有的图形样式。
2. nivo 基于 react 和 d3。支持的图形不少。我自己试了下， 太复杂了，上手难度有点大。
3. echarts 百度出品，国内用的比较多，但是 感觉有点丑。据说 bug 也比较多。
4. [d3.js] 这个可以说是绘图界的祖师爷了，功能过于强大，后面提到的好多库都是基于 d3 的。 但是因为比较底层，像我这种拿来党还是暂时用不上。

统计常用图

绝大多数的图还是画折线图这些的，大部分的库也是做这个的。

1. recharts 基于 React 和 D3.js。使用 SVG，只支持 line chart， bar chart 这些比较常见的。API 感觉有些复杂，不是很直观。
2. reactviz 基于 react，Uber 出品， 也是常见的统计图
3. chartist 亮点是有动画，没有依赖，体积特别小。 支持的图比较少
4. nvd3 这个看起来确实不错， 支持的图表类型一般，基于 d3.js。
5. chart.js 支持的数量也比较少，主要是 line chart 和 bar chart. 这个可能是标星最多的了。
6. xkcd 风格的图表

以下为不推荐的库：

1. apexchart 似乎是 fusion chart 的一个开源版本。
2. uvcharts.js 开发很不活跃，才 200 个星星
3. victory 没看出有什么特别吸引人的。
4. chartbuilder。好几年没有更新了。而且比较丑。
5. c3.js。基于 D3, 貌似图比较少。
6. toast。韩国的一个东西，还包含了日历。

图（Graph）

这里的图指的是计算机科学上的图，也就是由节点和边构成的结构。

1. sigma 用于绘制 graph 的。
2. cytoscape

时序数据

1. *dc.js。特点是支持 crossfilter。特别好看，不过支持的 图不多。
2. Lightweight Charts。比较小巧，适合 绘制金融数据。
3. dygraphs。这个貌似只是画线条图的
4. *uplot。特点是非常小，不支持任何交互。主要是画时 间序列的。
5. rickshaw Prometheus 使用过的绘图引擎。
6. [flot] 这个貌似是 grafana 的绘图引擎。

其他

1. plotly, plotly 是一个 Python 和 JavaScript 的绘图库。
2. g2plot
3. G2

uplot

综合以上的总结，试试 uplot.js

yarn add uplot

import React, {useEffect, useRef} from "react";
import uPlot from "uplot";

import "uplot/dist/uPlot.min.css";

function uPlotGraph({data, options}) {
    const plotRef = useRef();

    useEffect(function() {
        return new uPlot(options, data, plotRef);
    }, [options, data])

    return (
        <div ref={plotRef}></div>
    )
}

export default uPlotGraph;

uplot 的数据也很简单，就是 [X, Y1, Y2] 的形式，其中 X, Y 都是一个数组，X 中必须是单调递增 的数字，默认是解析为秒级的时间戳。

感觉 uplot 还是挺简陋的，换用 echarts 了.

参考

1. https://codesandbox.io/s/black-sun-md3js9-mq7m3
2. Using Apache Echarts with React