Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[V5]minimap和combo一起使用的时候报异常 #5455

Open
hanfengcan opened this issue Feb 21, 2024 · 2 comments
Open

[V5]minimap和combo一起使用的时候报异常 #5455

hanfengcan opened this issue Feb 21, 2024 · 2 comments

Comments

@hanfengcan
Copy link

问题描述

以下代码基于官网示例修改,在minimap的样例里面加入combo之后,异常了。

import { Graph as BaseGraph, Extensions, Util, extend } from '@antv/g6';

const Graph = extend(BaseGraph, {
  plugins: {
    minimap: Extensions.Minimap,
  },
});

import insertCss from 'insert-css';

const container = document.getElementById('container') as HTMLElement;
const width = container.scrollWidth;
const height = (container.scrollHeight || 500) - 110;
const data = Util.mock(20).random();

/** minimap with string config */
const minimap1 = 'minimap';
/** minimap with object onfig and delegate type */
const minimap2 = {
  key: 'minimap2',
  type: 'minimap',
  size: [300, 200],
  mode: 'delegate',
  delegateStyle: {
    fill: 'red',
  },
  className: 'g6-minimap-2',
  viewportClassName: 'g6-minimap-viewport-2',
};
/** minimap with object onfig and keyShape type */
const minimap3 = {
  key: 'minimap3',
  type: 'minimap',
  mode: 'keyShape',
  size: [300, 200],
  className: 'g6-minimap-3',
  viewportClassName: 'g6-minimap-viewport-3',
};
new Graph({
  container,
  width,
  height,
  data: {
    nodes: [
      { id: 'node1', data: { x: 250, y: 150, parentId: 'combo1' } },
      { id: 'node2', data: { x: 350, y: 150, parentId: 'combo1' } },
      { id: 'node3', data: { x: 250, y: 300, parentId: 'combo2' } },
    ],
    combos: [
      { id: 'combo1', data: { parentId: 'combo2' } },
      { id: 'combo2', data: {} },
    ],
  },
  layout: {
    type: 'force',
  },
  node: {
    labelShape: {
      text: {
        fields: ['id'],
        formatter: (model) => {
          return model.id;
        },
      },
    },
  },
  modes: {
    default: ['brush-select', 'zoom-canvas', 'activate-relations', 'drag-canvas', 'drag-node'],
  },
  plugins: [minimap1, minimap2, minimap3],
});

/** set the style of minimap  */
insertCss(`
  .g6-minimap-2 {
    position:absolute;
    bottom:40px;
    right:40px;
    box-shadow:0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  }
  .g6-minimap-viewport-2 {
    border: 2px solid rgb(25, 128, 255);
  }
  .g6-minimap-3 {
    position:absolute;
    bottom:40px;
    left:40px;
    box-shadow:0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  }
  .g6-minimap-viewport-3 {
    border: 2px solid rgb(25, 128, 255);
  }
`);

重现链接

上述代码

重现步骤

将上述代码复制到官网的样例

预期行为

无异常

平台

  • 操作系统: [Windows]
  • 网页浏览器: [edge]
  • G6 版本: [5.0.0-beta.28]

屏幕截图或视频(可选)

image

补充说明(可选)

No response

@hustcc
Copy link
Member

hustcc commented Feb 22, 2024

不好意思,v5 暂时不要在线上系统中使用,预计到 3 月底,API 才能稳定,你反馈的问题在之后会考虑进去。具体时间见:https://www.yuque.com/antv/g6/iwmdk3u32uwrsmi5

@hanfengcan
Copy link
Author

不好意思,v5 暂时不要在线上系统中使用,预计到 3 月底,API 才能稳定,你反馈的问题在之后会考虑进去。具体时间见:https://www.yuque.com/antv/g6/iwmdk3u32uwrsmi5

这个问题到这边项目里面也有出现,会有getRenderBounds的错误

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants