0.16.1 • Published 4 months ago

@visactor/vgrammar-core v0.16.1

Weekly downloads
-
License
MIT
Repository
-
Last release
4 months ago

VGrammar,不只是生成万千图表的可视化语法,更是化枯燥为神奇的数据魔法师。

image test unit test npm Version npm Download license

English | 简体中文

(演示视频)

简介

VGrammar 是 VisActor 可视化体系中的可视化语法库,基于可视化渲染引擎 VRender 进行组件封装。核心能力如下:

  1. 默认好用:语法简洁,接口完备,组件丰富,开发简单;
  2. 能力丰富:图表定义,动画编排,艺术表达,完整覆盖;
  3. 灵活扩展:图元渲染,数据映射,自动布局,轻松扩展;

仓库简介

本仓库包含如下 package

  1. VGrammar: 图形语法

使用

安装

npm package

// npm
npm install @visactor/vgrammar

// yarn
yarn add @visactor/vgrammar

快速上手

import { View } from '@visactor/vgrammar';

const spec = {
  data: [
    {
      id: 'table',
      values: [
        {
          value: 3676,
          name: ' ~ 29'
        },
        {
          value: 3872,
          name: '30 ~ 39'
        },
        {
          value: 1668,
          name: '40 ~ 49'
        },
        {
          value: 610,
          name: '50 ~'
        }
      ]
    },
    {
      id: 'pie',
      source: 'table',
      transform: [
        {
          type: 'pie',
          field: 'value',
          asStartAngle: 'startAngle',
          asEndAngle: 'endAngle'
        }
      ]
    }
  ],

  scales: [
    {
      id: 'colorScale',
      type: 'ordinal',
      domain: { data: 'table', field: 'name' },
      range: [
        '#6690F2',
        '#70D6A3',
        '#B4E6E2',
        '#63B5FC',
        '#FF8F62',
        '#FFDC83',
        '#BCC5FD',
        '#A29BFE',
        '#63C4C7',
        '#F68484'
      ]
    }
  ],

  marks: [
    {
      type: 'arc',
      from: { data: 'pie' },
      dependency: ['viewBox', 'colorScale'],
      encode: {
        update: (datum, element, params) => {
          const viewBox = params.viewBox;
          const maxR = Math.min(viewBox.width() / 2, viewBox.height() / 2);
          return {
            x: viewBox.x1 + viewBox.width() / 2,
            y: viewBox.y1 + viewBox.height() / 2,
            startAngle: datum.startAngle,
            endAngle: datum.endAngle,
            innerRadius: 100,
            outerRadius: maxR,
            fill: params.colorScale.scale(datum.name)
          };
        },
        hover: {
          fill: 'red'
        }
      }
    }
  ]
};

const vGrammarView = new View({
  autoFit: true,
  container: 'chart',
  hover: true
});
vGrammarView.parseSpec(spec);

vGrammarView.runAsync();

更多 demo 和详细教程

相关链接

生态

项目介绍

| VChart | 基于 VisActor/VGrammar 封装的图表库。 | | React 组件库 | 基于 VisActor/VChart 的 React 图表 组件库。 | | 智能生成组件 | 基于 AI 的智能图表生成组件 |

参与贡献

如想参与贡献,请先阅读 行为准则贡献指南

细流成河,终成大海!

许可证

MIT 协议

0.16.1

4 months ago

0.15.6-alpha.0

4 months ago

1.0.0-alpha.1

4 months ago

1.0.0-alpha.0

4 months ago

0.15.7

4 months ago

0.16.0

4 months ago

0.15.6

5 months ago

0.15.5-vstory.3

5 months ago

0.15.5-vstory.2

6 months ago

0.15.4-alpha.0

6 months ago

0.15.4

6 months ago

0.15.5

6 months ago

0.14.23

6 months ago

0.15.5-vstory.1

6 months ago

0.15.3

6 months ago

0.14.21-alpha.0

6 months ago

0.13.23-alpha.3

6 months ago

0.13.23-alpha.2

6 months ago

0.15.2

7 months ago

0.14.22

7 months ago

0.15.2-vstory.2

7 months ago

0.15.2-vstory.1

7 months ago

0.14.21

7 months ago

0.15.1-vstory.3

7 months ago

0.15.1-vstory.2

7 months ago

0.15.1

7 months ago

0.14.19

7 months ago

0.14.20

7 months ago

0.15.1-vstory.1

7 months ago

0.15.0

7 months ago

0.14.18

7 months ago

0.14.17

7 months ago

0.14.16

8 months ago

0.15.0-beta.0

8 months ago

0.15.0-beta.1

8 months ago

0.14.15

8 months ago

0.14.14

8 months ago

0.14.14-alpha.4

8 months ago

0.14.14-vstory.1

8 months ago

0.15.0-alpha.0

8 months ago

0.14.14-alpha.3

8 months ago

0.14.14-alpha.1

8 months ago

0.14.14-alpha.2

8 months ago

0.14.13

8 months ago

0.14.12

8 months ago

0.14.14-alpha.0

8 months ago

0.14.10-hotfix.0

9 months ago

0.14.11

9 months ago

0.14.10

9 months ago

0.14.8

10 months ago

0.14.9

10 months ago

0.13.23-alpha.1

9 months ago

1.14.2-alpha.0

10 months ago

0.14.5

10 months ago

0.14.6

10 months ago

0.14.7

10 months ago

0.14.1

10 months ago

0.14.2

10 months ago

0.14.3

10 months ago

0.14.4

10 months ago

0.14.2-alpha.2

10 months ago

0.14.2-alpha.0

10 months ago

0.14.2-alpha.1

10 months ago

0.13.22

10 months ago

0.13.23-alpha.0

10 months ago

0.14.7-alpha.0

10 months ago

0.12.12-beta.2

11 months ago

0.13.21

11 months ago

0.12.12-beta.1

11 months ago

0.14.0

11 months ago

0.13.21-alpha.0

11 months ago

0.13.20

11 months ago

0.14.0-alpha.7

11 months ago

0.14.0-alpha.6

11 months ago

0.14.0-alpha.5

11 months ago

0.13.19

11 months ago

0.13.18

11 months ago

0.14.0-alpha.4

11 months ago

0.13.17

11 months ago

0.14.0-alpha.3

12 months ago

0.13.16

12 months ago

0.14.0-alpha.2

12 months ago

0.13.16-alpha.1

12 months ago

0.13.16-alpha.0

12 months ago

0.14.0-alpha.1

1 year ago

0.14.0-alpha.0

1 year ago

0.13.12-alpha.0

1 year ago

0.13.12

1 year ago

0.13.11

1 year ago

0.13.15

12 months ago

0.13.14

1 year ago

0.13.13

1 year ago

0.13.11-alpha.0

1 year ago

0.13.11-alpha.2

1 year ago

0.13.11-alpha.1

1 year ago

0.13.11-alpha.3

1 year ago

0.13.11-alpha.5

1 year ago

0.13.9

1 year ago

0.13.10

1 year ago

0.13.7

1 year ago

0.13.8

1 year ago

0.13.6

1 year ago

0.13.5

1 year ago

0.13.4

1 year ago

0.13.3

1 year ago

0.13.2

1 year ago

0.13.0

1 year ago

0.13.1

1 year ago

0.12.12

1 year ago

0.13.0-alpha.13

1 year ago

0.12.11

1 year ago

0.13.0-alpha.12

1 year ago

0.13.0-alpha.11

1 year ago

0.12.10

1 year ago

0.13.0-alpha.10

1 year ago

0.12.9

1 year ago

0.13.0-alpha.9

1 year ago

0.13.0-alpha.8

1 year ago

0.13.0-alpha.7

1 year ago

0.13.0-alpha.6

1 year ago

0.13.0-alpha.5

1 year ago

0.13.0-alpha.4

1 year ago

0.13.0-alpha.3

1 year ago

0.13.0-alpha.2

1 year ago

0.13.0-alpha.1

1 year ago

0.13.0-alpha.0

1 year ago

0.12.9-alpha.1

1 year ago

0.12.8

1 year ago

0.12.8-alpha.1

1 year ago

0.12.8-alpha.0

1 year ago

0.12.7

1 year ago

0.12.6

1 year ago

0.12.5-alpha.4

1 year ago

0.10.14

1 year ago

0.12.5

1 year ago

0.12.5-alpha.3

1 year ago

0.12.5-alpha.2

1 year ago

0.12.5-alpha.1

1 year ago

0.12.5-alpha.0

1 year ago

0.10.13

1 year ago

0.12.2

1 year ago

0.12.3

1 year ago

0.12.4

1 year ago

0.11.17

1 year ago

0.11.18

1 year ago

0.11.16

1 year ago

0.11.15

1 year ago

0.11.15-alpha.4

1 year ago

0.11.15-alpha.3

1 year ago

0.12.1

1 year ago

0.11.15-alpha.1

1 year ago

0.11.15-alpha.0

1 year ago

0.12.0

1 year ago

0.11.13

1 year ago

0.11.14

1 year ago

0.11.12-alpha.2

1 year ago

0.11.12-alpha.3

1 year ago

0.11.12

1 year ago

0.11.12-alpha.0

1 year ago

0.11.12-alpha.1

1 year ago

0.11.10

1 year ago

0.11.11

1 year ago

0.11.9

1 year ago

0.11.8

1 year ago

0.11.6

1 year ago

0.11.7

1 year ago

0.11.4

1 year ago

0.11.5

1 year ago

0.10.12

1 year ago

0.11.5-alpha.0

1 year ago

0.10.11

1 year ago

0.11.2

1 year ago

0.11.3

1 year ago

0.10.10

1 year ago

0.11.0

1 year ago

0.11.1

1 year ago

0.10.9

1 year ago

0.10.8

1 year ago

0.10.8-alpha.0

1 year ago

0.11.0-alpha.0

2 years ago

0.11.0-alpha.1

2 years ago

0.10.7

2 years ago

0.10.6

2 years ago

0.10.5

2 years ago

0.8.7

2 years ago

0.10.4

2 years ago

0.10.3

2 years ago

0.10.2

2 years ago

0.10.1

2 years ago

0.10.0

2 years ago

0.9.5-alpha.0

2 years ago

0.10.0-alpha.7

2 years ago

0.10.0-alpha.8

2 years ago

0.10.0-alpha.6

2 years ago

0.10.0-alpha.5

2 years ago

0.10.0-alpha.4

2 years ago

0.10.0-alpha.3

2 years ago

0.9.4

2 years ago

0.9.3

2 years ago

0.9.2

2 years ago

0.10.0-alpha.2

2 years ago

0.10.0-alpha.1

2 years ago

0.9.1

2 years ago

0.8.6

2 years ago

0.8.5

2 years ago

0.8.4

2 years ago

0.9.0

2 years ago

0.10.0-alpha.0

2 years ago

0.9.0-alpha.1

2 years ago

0.9.0-alpha.0

2 years ago

0.8.4-alpha.0

2 years ago

0.8.3

2 years ago

0.8.3-alpha.0

2 years ago

0.8.2

2 years ago

0.8.1

2 years ago

0.8.0

2 years ago

0.8.0-alpha.0

2 years ago

0.7.7

2 years ago

0.7.7-alpha.2

2 years ago

0.7.7-alpha.1

2 years ago

0.7.6

2 years ago

0.7.6-alpha.0

2 years ago

0.7.5

2 years ago

0.7.4

2 years ago

0.7.4-alpha.3

2 years ago

0.7.4-alpha.2

2 years ago

0.7.4-alpha.1

2 years ago

0.7.4-alpha.0

2 years ago

0.7.3

2 years ago

0.7.2

2 years ago

0.7.1

2 years ago

0.7.0

2 years ago