antv G6中自定义线段中遇到的一些问题

393 阅读1分钟
  1. iconfont在首次加载的时候,无法显示的问题,初步分析是由于iconfont的css加载里面的字体文件时,采用的是@import url的形式,在第一次构建canvas画布的时候,该字体图标的文件未加载完成,所以只能够手动的去加载字体文件,具体的解决代码如下:

     const iconFontFace = new FontFace(
          'iconfont',
          'url(https:////at.alicdn.com/t/font_1430877_uphe5yhs6ca.woff2?t=1647316609001)'
        );
        document.fonts.add(iconFontFace);
        iconFontFace.load();
        document.fonts.ready.then(() => {
          this.initGraph();
          //this.registerState();
          this.handleGraphEvent();
        });
    
  2. 自定义线段的时候,初次展示没问题,由于drag线段造成了线段偏移,但是自定义的形状却没有跟随移动

    G6.registerEdge('edgeName', options, 'extendedEdgeName');
    这是由于options里面的默认update方法导致的,可以设置options里的
    update: undefined,
    
  3. 自定义线段的时候,出现了移动node之后,点击线边之后,出现了选中块的state的现象,这种只出现在extend polyline cubic等不规则的边的自定义边中。

image.png

```
update: undefined,
 
在update同级加入setState: undefined,重置内置的setState
```