antvis / g6-editor Goto Github PK

View Code? Open in Web Editor NEW

531.0 531.0 172.0 5.08 MB

JavaScript 59.31% CSS 40.69%

g6-editor's People

Contributors

Stargazers

Watchers

Forkers

shadowkun weimingtom mstestlp zhangming sinfuture gaiyangjun edwinyzh robin536180 slardar888 smilemilk 03131302 yumengqin wpp5354 cmjxiong wz-fork yvan-wyf qjs2000 murongqimiao weizai118 tubodev cdy15927308590 pinkonio lisir my-markdown cyqlegend forgxq dancingbrooks usefuu bobqiu mytrip fuyuzero awesome-archive arvinzr jannzhu sch-125061 dongongfeiyu kingzuo saberinorykiss azureidea cyonet elait j717273419 xiongfengyan1990 solidest zhaoshoulai fallowu wono01 bnulwh yufi113 chinazhenzhen mamkex mxz2dd zhouxuanxuan001 linvinglor cnliou joshua-jin skyyouare sky-hao xiaohao0414 junnuobaby jiangtao fanshurong wjwalker zengkun lovelifestar gequansheng0216 447109919 allan852 kayeez zhangkaiqiang128 onreadystatechange oulp wangwenjie1314 alex1504 yuanyinyan garyganyang soulcm machuanjia waynezona 569895754 mmodai zoloadang principlefirst cosdy yingxiongtang fengluandll bosscheng ed-wu freeman211314 rengeng1986 michaeltsai007 maomaoispan th5460 apan0206 elevenkey vickkyy wensheng2276 iqiuyu-0821 likaizhu qiuzhangcheng

g6-editor's Issues

Group样式设置无效

G6.Global.groupStyle= {
  fill: 'red'
}

单独在G6下设置是可以的，见下面示例：
https://codepen.io/liekkas/pen/XYvdja

但在G6-Editor中同样写法却无效

卡片与节点删除的回调没有作用

用了itemremove的监听，但没有作用。
代码如下：
this.page = new G6Editor.Flow({
graph: {
container: 'page',
}
});
this.page.on('itemremove', function(ev){
console.log(ev);
})

Contextmenu 是否支持自定义命令

data-command 标识该 dom 节点具体所对应的命令
节点具体所对应的命令是否可以自己定义

graph.read 传入空对象导致事件报错

现象
graph.read({})，会导致画布事件监听出错，比如 onMousemove 时，报错

场景
在 g6-editor 中，undo 代码调用的是 page.read()，若此时数据为空，则会导致报错

请问一下，怎么用webpack打包？自己配置和用您的配置都会报错

想修改逻辑和样式，发现无法使用webpack打包，是暂时不给这个功能吗？

flow.read 异步读取数据

实例化 Flow 对象后，如果异步读取流程数据，会造成画布上的内容和 minimap 上面的内容不同。

根据不同节点的属性，控制对节点的操作，比如A属性的节点无法删除

需求有做到控制节点的操作，限制某些特定属性的节点，无法删除

我npm i tnpm -g 无效，然后cpm istall的组件中引入 import G6Editor from '@antv/g6-editor' 然后根据文档的第一步和第二步就会报错： TypeError: Cannot read property 'appendChild' of null
e.t.initContainer
D:/JointJS/jointJs/node_modules/@[email protected]@@antv/g6-editor/build/g6Editor.js:1

画布中删除所有节点时，minimap不会清空，还会保留一个元素

editor如何做布局？

如何添加布局？

demo中的图片缺失

demos/assets/screenshots下面的几个图片资源是不是忘记了add？

支持触摸板缩放

如何禁止已经连接节点的线段不被拖动？

目前没有找到方法，本人的解决办法是：
graph.on('dragstart', (ev)=>{
if(ev.shape && ev.shape.eventPreFix == 'edgeControlPoint') {
// 下段代码为报错代码，人为让该方法报错，可以阻止线段移动
xDom = domX, yDom = domY;
}
});

如何注册流程图节点啊？谢谢！

官网给的是这个，不会用。给的参考链接也无法访问。
Flow.registerNode(name, {
// 参考：https://lark.alipay.com/antv/rslism/anchor
anchor,
// 绘制
draw(item) {
return keyShape;
},
}, extandShape);
G6.registerNode的方法试了也不行。有谁做过自己注册的流图节点么？

如何将自定义节点改为SVG

项目中需要点击自定义节点上的图标来进行更进一步操作，请问目前能获取到节点上的图标吗

自定义节点有图标时，初次添加minimap会丢失图标

再次操作节点minimap才会呈现。

官网例子也有这样情况

请问下g6-editor中的选中节点激活这个怎么实现？

尝试用g6实现，不过这个地方block了

  G6.registerNode('NodeECS', {
    draw(item){
      const group = item.getGraphicGroup();
      group.addShape('text', {
        attrs: {
          x: 30,
          y: 0,
          fill: '#333',
          text: 'ECS'
        }
      });
      // group.addShape('rect', {
      //   attrs: {
      //     x: -5,
      //     y: -20,
      //     width:90,
      //     height:100,
      //     stroke: '#13c2c2'
      //   }
      // });
      group.addShape('image', {
        attrs: {
          x: 0,
          y: 0,
          width: 80,
          height: 80,
          img: require('../assets/ecs.svg')
        }
      });
      return group;
    },
    anchor: [
      [0.5, 1],
      [0,5, 0]
    ],
  });


  graph.on('node:mouseenter', function(ev) {
    console.log(ev.item);
    graph.update(ev.item, {
       //此处不清楚如何变更，文档针对model没有准确说明  
    });
  });

当节点为空的时候，minimap 没有清空

IE下（电脑是IE11）,在画布添加元素后，滚动鼠标滚轮，页面空白.

引用了以上babel库，是引用的版本不对么，还是少引用了什么？

使用反馈

戳这里： https://www.yuque.com/antv/g6-editor/feedback

没有数据模型拓展接口

目前只有node 和edge两种数据模型，希望提供注册自定义数据模型的接口，拖入不同的节点类型的时候生成的节点对应相应的数据模型，而不是所有的节点都是node的数据模型。

锚点输入输出项的配置失效

环境

    "@antv/g2": "^3.2.6",
    "@antv/g6": "^2.1.0",
    "@antv/g6-editor": "^1.0.8",

用法

Flow.registerNode(
      'test',
      {
        anchor: [
          [
            1,
            0.5,
            {
              type: 'input', // 这里只允许输入
            },
          ],
 [
            1,
            1,
            {
              type: 'output', // 只允许输出
            },
          ],
        ],
      },
      'flow-node',
    );

关于锚点的这种写法是参考的官网上的例子，但是不起作用，仍然可以随意连接。
这种写法有问题吗

当节点打成组后,如果这个组搜收缩时,此时解散组,会造成改组里所有节点消失删除

当节点打成组后,如果这个组搜收缩时,此时解散组,会造成改组里所有节点消失删除.
另外复制组时,组里的节点链接线丢失

复制分组时里面的连线会丢失

如图所示

求开源

有像 G6一样暴露关闭打点的方法吗

如何固定编辑器范围，固定节点位置不可拖动？

为实现连线功能，需固定编辑器范围和节点。

Is there any plan to open source this project?

G6 edit is a pioneering library of schematic components, i have already seen G6 edit design, beautiful views and good Interactive for use, i am very want to see how to compute nodes location, move and connect Nodes, so, i want ask is there any plan to open source this project?

鼠标滑动canvas内容区域，浏览器控制台报错

报错内容:
base.js:7 Uncaught TypeError: Cannot read property 'minX' of undefined
at t.value (base.js:7)
at t. (base.js:7)
at t.a.emitEvent (base.js:7)
at t.a.emit (base.js:7)
at t.emitGraphEvent (base.js:7)
at t._triggerEvent (base.js:7)
at t._simulateEvents (base.js:7)
at HTMLDivElement. (base.js:7)

可重现地址:https://antv.alipay.com/assets/dist/3.0.0/g6/1.x/editor/base.html

const page = new G6Editor.Flow({
      graph: {
        renderer: 'svg',
        container: 'page',
        height
      },
      align: {
        grid: true
      },
      noEndEdge: false,
      edgeResizeable: false
    });

在经过一些本地适配后感觉g6 editor能作为实际产品中的一部分后改如何获得授权，授权协议是怎样的（我们老大已经发邮件了但是没有回复）？
是否受@antv/g6-plugins的GPL协议约束？（minimap貌似是g6 plugins里面的东西）

antd 的依赖需要升级到 ^3.0.0

不然项目中如果依赖了 antd ，那么 antd 的不同版本的样式会被重复引入，可能会导致冲突。

minimap的背景样式设置无效

我看API里minimap有viewportBackStyle、viewportWindowStyle来设置样式。

 new G6Editor.Minimap({
        container: 'minimap',
        height: 120,
        width: 200,
        viewportBackStyle: {
          fill: '#336699'
        }
      });

但实际上，渲染的dom元素里把背景色写死成白色了。设置的样式未生效。

<div class="g6-editor-minimap-container" style="background: rgb(255, 255, 255); position: absolute; overflow: hidden;">
...
</div>