gg-editor
    TypeScript icon, indicating that this package has built-in type declarations

    3.1.3 • Public • Published

    English | 简体中文

    GGEditor

    基于 G6React 的可视化图编辑器

    GitHub npm npm

    安装

    npm

    npm install gg-editor --save

    umd

    <script src="https://unpkg.com/gg-editor@${version}/dist/index.js"></script>

    使用

    流程图

    Edit GGEditor - Flow

    import GGEditor, { Flow } from 'gg-editor';
     
    const data = {
      nodes: [
        {
          id: '0',
          label: 'Node',
          x: 55,
          y: 55,
        },
        {
          id: '1',
          label: 'Node',
          x: 55,
          y: 255,
        },
      ],
      edges: [
        {
          label: 'Label',
          source: '0',
          target: '1',
        },
      ],
    };
     
    <GGEditor>
      <Flow style={{ width: 500, height: 500 }} data={data} />
    </GGEditor>;

    脑图

    Edit GGEditor - Mind

    import GGEditor, { Mind } from 'gg-editor';
     
    const data = {
      label: 'Central Topic',
      children: [
        {
          label: 'Main Topic 1',
        },
        {
          label: 'Main Topic 2',
        },
        {
          label: 'Main Topic 3',
        },
      ],
    };
     
    <GGEditor>
      <Mind style={{ width: 500, height: 500 }} data={data} />
    </GGEditor>;

    示例

    # 克隆仓库 
    $ git clone https://github.com/alibaba/GGEditor.git
     
    # 切换目录 
    cd gg-editor
     
    # 安装依赖 
    $ npm install
     
    # 运行示例 
    $ npm start

    Install

    npm i gg-editor

    DownloadsWeekly Downloads

    3,985

    Version

    3.1.3

    License

    MIT

    Unpacked Size

    15 MB

    Total Files

    2666

    Last publish

    Collaborators

    • gaoli