Package Exports

@antv/s2

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@antv/s2) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

简体中文 | English

[WIP]S2

数据驱动的多维分析表格。

🚧 激情建设中。.. 详见 Roadmap for S2

S2 是 AntV 在多维交叉分析表格领域的解决方案，完全基于数据驱动的方式。通过提供底层能力库，基础组件，业务场景组件以及自由扩展的能力，让开发者基于自身场景自由选择，既能开箱即用，又能自由发挥。

✨ 特性

多维交叉分析：告别单一分析维度，全面拥抱任意维度的自由组合分析。
高性能：能支持全量百万数据下 <8s 渲染，也能通过局部下钻来实现秒级渲染。
高扩展性：支持任意的自定义扩展（包括但不局限于布局，样式，交互，数据 hook 流等）。
开箱即用：提供不同分析场景下开箱即用的 react 表组件及配套分析组件，只需要简单的配置即可轻松实现复杂场景的表渲染。
可交互：支持丰富的交互形式（单选、圈选、行选、列选、冻结行头、宽高拖拽，自定义交互等）

📦 安装

$ npm install @antv/s2
# yarn add @antv/s2

🔨 使用

1. 数据准备

s2DataConfig

const s2DataConfig = {
  fields: {
    rows: ['province', 'city'],
    columns: ['type'],
    values: ['price'],
  },
  data: [
     {
      province: '浙江',
      city: '杭州',
      type: '笔',
      price: '1',
    },
    {
      province: '浙江',
      city: '杭州',
      type: '纸张',
      price: '2',
    },
    {
      province: '浙江',
      city: '舟山',
      type: '笔',
      price: '17',
    },
    {
      province: '浙江',
      city: '舟山',
      type: '纸张',
      price: '0.5',
    },
    {
      province: '吉林',
      city: '丹东',
      type: '笔',
      price: '8',
    },
    {
      province: '吉林',
      city: '白山',
      type: '笔',
      price: '9',
    },
    {
      province: '吉林',
      city: '丹东',
      type: ' 纸张',
      price: '3',
    },
    {
      province: '吉林',
      city: '白山',
      type: '纸张',
      price: '1',
    },
  ],
};

2. 配置项准备

const s2options = {
  width: 600,
  height: 600,
}

3. 渲染

<div id="container"></div>

import { PivotSheet } from '@antv/s2';
import '@antv/s2/dist/s2.min.css'

const container = document.getElementById('container');

const s2 = new PivotSheet(container, s2DataConfig, s2options)

s2.render()

4. 结果

result

Author

👤 @AntV

🤝 参与贡献

git clone git@github.com:antvis/S2.git

cd s2

yarn

yarn core:start

# 本地启动官网

yarn site:bootstrap

yarn site:start

📄 License

MIT@AntV.