antvis/G6

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

hanfengcan posted onGitHub

问题描述

以下代码基于官网示例修改,在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


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

posted by hustcc about 1 year ago

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

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

posted by hanfengcan about 1 year ago

This issue has been closed because it has been outdate for a long time. Please open a new issue if you still need help.

这个 issue 已经被关闭,因为 它已经过期很久了。 如果你仍然需要帮助,请创建一个新的 issue。

posted by github-actions[bot] 6 months ago

Fund this Issue

$0.00
Funded

Pull requests