@vennnn/flex-table

可用于展示大量数据的表格;

Usage no npm install needed!

<script type="module">
  import vennnnFlexTable from 'https://cdn.skypack.dev/@vennnn/flex-table';
</script>

README

可用于展示大量数据的表格;

特点: 表头固定; 第一列固定; 主体区域可滚动;

window.onload = function () {
        var flexTable = new FlexTable({
            id: 'table'
        });
        
        var data = 
                    {
            "title": [
                "项目",
                "时间"
            ],
            "header": [
                {
                    "content": "A",
                    "children": [
                        "A1"
                    ]
                },
                {
                    "content": "B",
                    "children": [
                        "B1",
                        "B2",
                        "B3"
                    ]
                },
                {
                    "content": "C",
                    "children": [
                        "C1"
                    ]
                },
                {
                    "content": "D",
                    "children": [
                        "D1"
                    ]
                },
                {
                    "content": "F",
                    "children": [
                        "F"
                    ]
                },
                {
                    "content": "G",
                    "children": [
                        "G"
                    ]
                }
            ],
            "firstColumns": [
                "2018-07-04 13:00:00",
                "2018-07-04 13:01:00",
                "2018-07-04 13:02:00",
                "2018-07-04 13:03:00",
                "2018-07-04 13:04:00",
                "2018-07-04 13:05:00",
                "2018-07-04 13:06:00",
                "2018-07-04 13:07:00",
                "2018-07-04 13:08:00",
                "2018-07-04 13:09:00",
                "2018-07-04 13:10:00",
                "2018-07-04 13:11:00",
                "2018-07-04 13:12:00",
                "2018-07-04 13:13:00",
                "2018-07-04 13:14:00",
                "2018-07-04 13:15:00",
                "2018-07-04 13:16:00",
                "2018-07-04 13:17:00",
                "2018-07-04 13:18:00",
                "2018-07-04 13:19:00",
                "2018-07-04 13:20:00",
                "2018-07-04 13:21:00",
                "2018-07-04 13:22:00",
                "2018-07-04 13:23:00",
                "2018-07-04 13:24:00",
                "2018-07-04 13:25:00",
                "2018-07-04 13:26:00",
                "2018-07-04 13:27:00",
                "2018-07-04 13:28:00",
                "2018-07-04 13:29:00",
                "2018-07-04 13:30:00",
                "2018-07-04 13:31:00",
                "2018-07-04 13:32:00",
                "2018-07-04 13:33:00",
                "2018-07-04 13:34:00",
                "2018-07-04 13:35:00",
                "2018-07-04 13:36:00",
                "2018-07-04 13:37:00",
                "2018-07-04 13:38:00",
                "2018-07-04 13:39:00",
                "2018-07-04 13:40:00",
                "2018-07-04 13:41:00",
                "2018-07-04 13:42:00",
                "2018-07-04 13:43:00",
                "2018-07-04 13:44:00",
                "2018-07-04 13:45:00",
                "2018-07-04 13:46:00",
                "2018-07-04 13:47:00",
                "2018-07-04 13:48:00",
                "2018-07-04 13:49:00",
                "2018-07-04 13:50:00",
                "2018-07-04 13:51:00",
                "2018-07-04 13:52:00",
                "2018-07-04 13:53:00",
                "2018-07-04 13:54:00",
                "2018-07-04 13:55:00",
                "2018-07-04 13:56:00",
                "2018-07-04 13:57:00",
                "2018-07-04 13:58:00",
                "2018-07-04 13:59:00",
                "2018-07-04 14:00:00"
            ],
            "data": [
                [
                    "49.99",
                    "13.10",
                    "12.80",
                    "12.60",
                    "-223.00",
                    "0.00",
                    "-52.00",
                    "229.00"
                ],
                [
                    "50.02",
                    "12.30",
                    "11.90",
                    "11.70",
                    "-207.00",
                    "0.00",
                    "-47.00",
                    "212.00"
                ],
                [
                    "50.00",
                    "12.60",
                    "12.20",
                    "11.70",
                    "-210.00",
                    "0.00",
                    "-48.00",
                    "215.00"
                ],
                [
                    "49.99",
                    "13.10",
                    "12.70",
                    "12.00",
                    "-221.00",
                    "0.00",
                    "-48.00",
                    "226.00"
                ],
                [
                    "49.99",
                    "12.50",
                    "12.20",
                    "11.90",
                    "-212.00",
                    "0.00",
                    "-48.00",
                    "218.00"
                ],
                [
                    "49.99",
                    "12.10",
                    "11.90",
                    "11.50",
                    "-203.00",
                    "0.00",
                    "-48.00",
                    "209.00"
                ],
                [
                    "50.03",
                    "13.60",
                    "12.70",
                    "12.60",
                    "-225.00",
                    "0.00",
                    "-48.00",
                    "230.00"
                ],
                [
                    "49.98",
                    "13.10",
                    "12.70",
                    "12.50",
                    "-221.00",
                    "0.00",
                    "-49.00",
                    "227.00"
                ],
                [
                    "50.03",
                    "12.90",
                    "12.10",
                    "11.70",
                    "-211.00",
                    "0.00",
                    "-49.00",
                    "217.00"
                ],
                [
                    "49.97",
                    "13.00",
                    "12.30",
                    "12.00",
                    "-216.00",
                    "0.00",
                    "-51.00",
                    "222.00"
                ],
                [
                    "49.98",
                    "12.30",
                    "11.90",
                    "11.30",
                    "-203.00",
                    "0.00",
                    "-49.00",
                    "209.00"
                ],
                [
                    "50.02",
                    "13.40",
                    "13.10",
                    "12.80",
                    "-229.00",
                    "0.00",
                    "-47.00",
                    "234.00"
                ],
                [
                    "49.98",
                    "13.40",
                    "12.60",
                    "12.40",
                    "-221.00",
                    "0.00",
                    "-48.00",
                    "226.00"
                ],
                [
                    "50.03",
                    "12.00",
                    "11.70",
                    "11.70",
                    "-201.00",
                    "0.00",
                    "-46.00",
                    "207.00"
                ],
                [
                    "50.00",
                    "13.70",
                    "12.90",
                    "12.60",
                    "-228.00",
                    "0.00",
                    "-48.00",
                    "233.00"
                ],
                [
                    "50.03",
                    "13.30",
                    "12.30",
                    "12.30",
                    "-220.00",
                    "0.00",
                    "-48.00",
                    "225.00"
                ],
                [
                    "50.03",
                    "12.60",
                    "12.20",
                    "12.00",
                    "-203.00",
                    "0.00",
                    "-49.00",
                    "209.00"
                ],
                [
                    "50.03",
                    "12.80",
                    "11.90",
                    "11.80",
                    "-210.00",
                    "0.00",
                    "-49.00",
                    "216.00"
                ],
                [
                    "50.00",
                    "12.80",
                    "12.40",
                    "12.00",
                    "-216.00",
                    "0.00",
                    "-46.00",
                    "220.00"
                ],
                [
                    "50.02",
                    "12.60",
                    "12.00",
                    "11.50",
                    "-210.00",
                    "0.00",
                    "-44.00",
                    "215.00"
                ],
                [
                    "50.02",
                    "12.30",
                    "12.30",
                    "11.70",
                    "-205.00",
                    "0.00",
                    "-46.00",
                    "211.00"
                ],
                [
                    "50.00",
                    "12.70",
                    "12.20",
                    "11.80",
                    "-212.00",
                    "0.00",
                    "-45.00",
                    "217.00"
                ],
                [
                    "50.00",
                    "13.60",
                    "13.90",
                    "13.10",
                    "-236.00",
                    "0.00",
                    "-48.00",
                    "241.00"
                ],
                [
                    "50.01",
                    "14.00",
                    "13.40",
                    "13.50",
                    "-238.00",
                    "0.00",
                    "-45.00",
                    "243.00"
                ],
                [
                    "50.00",
                    "13.00",
                    "12.60",
                    "12.50",
                    "-222.00",
                    "0.00",
                    "-47.00",
                    "227.00"
                ],
                [
                    "50.02",
                    "12.50",
                    "11.70",
                    "11.90",
                    "-210.00",
                    "0.00",
                    "-44.00",
                    "214.00"
                ],
                [
                    "49.98",
                    "12.70",
                    "12.30",
                    "12.00",
                    "-215.00",
                    "0.00",
                    "-48.00",
                    "220.00"
                ],
                [
                    "50.02",
                    "14.20",
                    "12.80",
                    "13.20",
                    "-234.00",
                    "0.00",
                    "-48.00",
                    "239.00"
                ],
                [
                    "49.97",
                    "13.00",
                    "12.00",
                    "12.60",
                    "-218.00",
                    "0.00",
                    "-47.00",
                    "223.00"
                ],
                [
                    "50.02",
                    "13.00",
                    "12.00",
                    "12.40",
                    "-217.00",
                    "0.00",
                    "-47.00",
                    "222.00"
                ],
                [
                    "50.02",
                    "12.30",
                    "11.50",
                    "11.90",
                    "-206.00",
                    "0.00",
                    "-47.00",
                    "212.00"
                ],
                [
                    "50.01",
                    "12.40",
                    "11.30",
                    "11.80",
                    "-206.00",
                    "0.00",
                    "-45.00",
                    "211.00"
                ],
                [
                    "50.01",
                    "14.80",
                    "13.80",
                    "14.10",
                    "-249.00",
                    "0.00",
                    "-48.00",
                    "254.00"
                ],
                [
                    "50.01",
                    "14.80",
                    "14.30",
                    "14.80",
                    "-256.00",
                    "0.00",
                    "-49.00",
                    "261.00"
                ],
                [
                    "50.00",
                    "13.70",
                    "12.70",
                    "12.90",
                    "-228.00",
                    "0.00",
                    "-48.00",
                    "233.00"
                ],
                [
                    "49.97",
                    "12.40",
                    "11.40",
                    "11.50",
                    "-203.00",
                    "0.00",
                    "-47.00",
                    "208.00"
                ],
                [
                    "49.97",
                    "12.00",
                    "11.30",
                    "11.20",
                    "-200.00",
                    "0.00",
                    "-47.00",
                    "205.00"
                ],
                [
                    "50.00",
                    "13.60",
                    "12.80",
                    "12.90",
                    "-227.00",
                    "0.00",
                    "-48.00",
                    "233.00"
                ],
                [
                    "50.02",
                    "13.80",
                    "13.40",
                    "12.60",
                    "-227.00",
                    "0.00",
                    "-46.00",
                    "231.00"
                ],
                [
                    "50.03",
                    "12.00",
                    "12.20",
                    "11.20",
                    "-202.00",
                    "0.00",
                    "-45.00",
                    "207.00"
                ],
                [
                    "49.98",
                    "11.70",
                    "11.40",
                    "10.50",
                    "-194.00",
                    "0.00",
                    "-44.00",
                    "199.00"
                ],
                [
                    "50.01",
                    "12.10",
                    "12.00",
                    "11.00",
                    "-204.00",
                    "0.00",
                    "-46.00",
                    "209.00"
                ],
                [
                    "49.97",
                    "12.30",
                    "12.30",
                    "10.90",
                    "-205.00",
                    "0.00",
                    "-48.00",
                    "210.00"
                ],
                [
                    "50.02",
                    "14.00",
                    "13.40",
                    "12.60",
                    "-232.00",
                    "0.00",
                    "-48.00",
                    "237.00"
                ],
                [
                    "49.99",
                    "14.10",
                    "13.70",
                    "12.70",
                    "-234.00",
                    "0.00",
                    "-50.00",
                    "239.00"
                ],
                [
                    "50.00",
                    "12.60",
                    "12.30",
                    "11.20",
                    "-209.00",
                    "0.00",
                    "-47.00",
                    "214.00"
                ],
                [
                    "49.98",
                    "12.60",
                    "12.10",
                    "11.20",
                    "-206.00",
                    "0.00",
                    "-47.00",
                    "212.00"
                ],
                [
                    "50.00",
                    "12.80",
                    "12.70",
                    "11.60",
                    "-215.00",
                    "0.00",
                    "-48.00",
                    "220.00"
                ],
                [
                    "49.98",
                    "12.10",
                    "12.00",
                    "11.40",
                    "-204.00",
                    "0.00",
                    "-49.00",
                    "210.00"
                ],
                [
                    "49.99",
                    "12.30",
                    "11.90",
                    "11.40",
                    "-205.00",
                    "0.00",
                    "-46.00",
                    "211.00"
                ],
                [
                    "50.02",
                    "12.80",
                    "12.70",
                    "11.70",
                    "-213.00",
                    "0.00",
                    "-48.00",
                    "219.00"
                ],
                [
                    "49.98",
                    "12.30",
                    "11.80",
                    "11.00",
                    "-203.00",
                    "0.00",
                    "-45.00",
                    "208.00"
                ],
                [
                    "50.02",
                    "14.80",
                    "14.30",
                    "13.40",
                    "-245.00",
                    "0.00",
                    "-48.00",
                    "249.00"
                ],
                [
                    "50.03",
                    "14.80",
                    "14.60",
                    "14.00",
                    "-243.00",
                    "0.00",
                    "-47.00",
                    "248.00"
                ],
                [
                    "50.00",
                    "13.40",
                    "12.90",
                    "12.10",
                    "-223.00",
                    "0.00",
                    "-45.00",
                    "227.00"
                ],
                [
                    "50.02",
                    "12.50",
                    "12.30",
                    "11.30",
                    "-209.00",
                    "0.00",
                    "-41.00",
                    "213.00"
                ],
                [
                    "49.97",
                    "11.70",
                    "11.50",
                    "10.70",
                    "-195.00",
                    "0.00",
                    "-41.00",
                    "200.00"
                ],
                [
                    "50.00",
                    "12.30",
                    "12.30",
                    "11.70",
                    "-211.00",
                    "0.00",
                    "-45.00",
                    "216.00"
                ],
                [
                    "50.02",
                    "12.60",
                    "12.30",
                    "11.50",
                    "-210.00",
                    "0.00",
                    "-44.00",
                    "215.00"
                ],
                [
                    "49.98",
                    "12.10",
                    "12.00",
                    "11.40",
                    "-205.00",
                    "0.00",
                    "-43.00",
                    "210.00"
                ],
                [
                    "50.03",
                    "10.90",
                    "10.60",
                    "10.10",
                    "-183.00",
                    "0.00",
                    "-39.00",
                    "187.00"
                ]
            ]
        }
        flexTable.update(data);