适用于 React 和 JavaScript 的 免费透视表

用户在一百万行数据上拖放字段,自己搭出原本要找你要的报表。汇总在 Web Worker 中计算,并附带一个数据表格。185 项功能中有 122 项无需许可证。

PivotGrid:按地区和类别统计的各季度收入与数量,含小计

在此直接试用

两个组件,真实数据,在您的浏览器中运行。无需安装。

DataGrid

ReactBuilt for ReactJavaScriptPlain JavaScript, no framework required
查看演示 →
正在加载演示…

PivotGrid

ReactBuilt for ReactJavaScriptPlain JavaScript, no framework required
查看演示 →
正在加载演示…
Community · free forever

122 of 185 features need no licence key

No trial clock, no watermark, no signup. Commercial use included. The paid tiers start where you change the data and where you take it out — editing, grouping on the server, styled Excel and PDF export, charts.

Install and render

npm install @kanunilabs/datagrid-react
import { DataGrid } from '@kanunilabs/datagrid-react';
import '@kanunilabs/datagrid-react/styles.css';

<DataGrid
  gridId="sales"
  dataSource={rows}
  rowKey="id"
  columns={columns}
  style={{ height: 600 }}
/>

No bundler configuration: the Web Worker is compiled into the package and started from a Blob URL. Prefer no framework? createGrid() does the same without React.

Measured, and reproducible

Sort, numeric
101 ms
Sort, text
90 ms
first query 1.8 s
Filter, equality
18 ms
Free-text search
65 ms
first query 413 ms

1,000,000 rows × 9 columns, columnar engine, median of 3 runs; a first query builds a per-column index. The method, and the command to run it yourself.

  • 4,939 tests across 582 files
  • 118/118 DataGrid features have a live, editable demo
  • 37 published releases
  • 12 locales, Arabic RTL included

一个内核,多种组件

框架无关的内核,驱动着不断扩展的高性能数据组件套件。

PivotGrid
已上线

PivotGrid

高性能数据透视表,采用 Web Worker 引擎,支持计算字段、图表与导出。

ReactBuilt for ReactJavaScriptPlain JavaScript, no framework required
查看文档
DataGrid
已上线

DataGrid

快速的虚拟化数据表格 — 排序、筛选、分组与行内编辑。

ReactBuilt for ReactJavaScriptPlain JavaScript, no framework required
查看文档

您期望的一切

与框架无关。

Web Worker 引擎

即使在海量数据集中也能保持流畅的界面。

计算字段

安全的公式编辑器和实时预览。

图表

使用一个属性将透视视图同步到图表。

高级过滤

可视预过滤构建器和标题过滤。

导出

支持 Excel 和 PDF 导出。

支持12种语言

开箱即用的本地化,支持 RTL。

让表格匹配你的产品

从 36 套浅色和深色配色方案中选择,或在主题生成器中创建自己的方案:在实时的 DataGrid 和 PivotGrid 上修改任意颜色,随时检查对比度,并导出样式表。免费,适用于 React 和原生 JavaScript。

打开主题生成器

Questions people ask first

Is it really free?

The Community edition is, for both components: 70 of the 118 DataGrid features and 52 of the 67 PivotGrid features work with no licence key, no watermark and no expiry, and commercial use is included. Editing a cell in place is included. Paid tiers add batch and form editing with validation and undo, grouping on the server, styled Excel and PDF export, charts and multi-level grouping.

Is it open source?

No. Community is free of charge but proprietary — the source is not distributed. If an OSI-approved licence is a requirement for you, this is the wrong library and it is better to know now.

Which frameworks are supported?

React 18+ and plain JavaScript with no framework at all. The JavaScript renderer has full feature parity, enforced in CI, and ships a UMD build so a script tag is a complete install. Angular and Vue are not supported today.

How fast is it, really?

At 1,000,000 rows by 9 columns, on the code path the worker runs, median of 3 runs: numeric sort 101 ms, text sort 90 ms cached (1.8 s on the first query, which builds a sort index), equality filter 18 ms, free-text search 65 ms cached (413 ms on the first query). The performance page publishes the method and the command so you can run it on your own machine.

Do I need to configure a Web Worker?

No. The worker is compiled into the package and started from a Blob URL, so there is no file to copy into public/, no bundler recipe and nothing to import. Vite, webpack, Next.js and Parcel all work as they are — and so does no bundler at all.

One licence covers both components?

Yes. A paid key unlocks the Enterprise features of DataGrid and PivotGrid together. There is no second purchase and no second key.

What happens when my subscription ends?

You keep the last version you paid for, and applications already shipped with it stay licensed and keep working. You stop receiving new versions and support. Nothing you have deployed starts showing a watermark.

Can I try it before buying?

Install the Community edition and build with it for as long as you like — it is not a trial. The paid features have live, editable demos in the playground, and the enterprise guides show the configuration. There is no time-limited trial key; instead, every purchase can be refunded in full within 14 days, for any reason.

查看实际数据

在浏览器中分析数据。