antvis/G6

Method not implemented. 报错。 #6050

anyone0034 posted onGitHub

Describe the bug / 问题描述

我是直接复制的官方demo,没有做任何修改。

Uncaught runtime errors:
×
ERROR
Method not implemented.
    at Camera.createLandmark (http://localhost:7004/js/e216158b.js:2281:15)
    at ViewportController.createLandmark (http://localhost:7004/js/vendors-node_modules_antv_g-camera-api_node_modules_antv_g-math_dist_index_esm_js-node_module-d028d5.js:38639:28)
    at ViewportController.transform (http://localhost:7004/js/vendors-node_modules_antv_g-camera-api_node_modules_antv_g-math_dist_index_esm_js-node_module-d028d5.js:38780:43)
    at new ViewportController (http://localhost:7004/js/vendors-node_modules_antv_g-camera-api_node_modules_antv_g-math_dist_index_esm_js-node_module-d028d5.js:38863:14)
    at Graph.initRuntime (http://localhost:7004/js/vendors-node_modules_antv_g-camera-api_node_modules_antv_g-math_dist_index_esm_js-node_module-d028d5.js:37416:61)
    at Graph.prepare (http://localhost:7004/js/vendors-node_modules_antv_g-camera-api_node_modules_antv_g-math_dist_index_esm_js-node_module-d028d5.js:37429:14)
    at async Graph.render (http://localhost:7004/js/vendors-node_modules_antv_g-camera-api_node_modules_antv_g-math_dist_index_esm_js-node_module-d028d5.js:37445:9)

以下是代码示例:

import { Graph } from '@antv/g6';
import { useEffect, useRef } from 'react';

export default () => {
    const containerRef = useRef<HTMLDivElement>(null);

    useEffect(() => {
        const graph = new Graph({
            container: containerRef.current!,
            width: 500,
            height: 500,
            data: {
                nodes: [
                    {
                        id: 'node-1',
                        style: { x: 50, y: 100 },
                    },
                    {
                        id: 'node-2',
                        style: { x: 150, y: 100 },
                    },
                ],
                edges: [{ id: 'edge-1', source: 'node-1', target: 'node-2' }],
            },
        });

        graph.render();
    }, []);



    return <div ref={containerRef} />;


};

No response

Steps to Reproduce the Bug or Issue / 重现步骤

Method not implemented. 报错。不太稳定,我也不知道是什么问题。我使用的是"@antv/g6": "^5.0.9",这个版本,一会报错Graph找不到,一会报错graph.data方法不存在……麻烦能不能给一个稳定的demo.

G6 Version / G6 版本

🆕 "@antv/g6": "^5.0.9",

Operating System / 操作系统

Windows

Browser / 浏览器

Chrome

Additional context / 补充说明

No response


6ea16dc99709fbbea002360b85a1ffa

posted by anyone0034 9 months ago

c9c7421ff54376ad48c8a10eecbdaa5

posted by anyone0034 9 months ago
  1. 建议提供完整代码
  2. 检查 G6 引入方式
  3. Graph 不存在 data 方法,API 见:https://g6-next.antv.antgroup.com/api/graph/method
posted by Aarebecca 9 months ago
  1. 建议提供完整代码
  2. 检查 G6 引入方式
  3. Graph 不存在 data 方法,API 见:https://g6-next.antv.antgroup.com/api/graph/method

同样存在该问题,目前看出来是@antv/g6-extension-react的问题,安装了之后渲染会报Error: Method not implemented,createLandmark这个方法,表现为canvas无法拖动放大,无法居中,操作的话会就报Error: Method not implemented,卸载后渲染没有问题

posted by ChenLeoXX 9 months ago

不排除是否是因为在 React 环境使用的原因,在 React 严格模式下需要小心处理和 G6 的执行时序,为了避免这一问题,推荐在 React 环境下使用 @antv/graphin,该框架是基于 G6 的 React 封装,你仍然可以使用 @antv/g6-extension-react 中的内容。

posted by Aarebecca 9 months ago

我也碰到此问题,但是排查下来,是引入多依赖,造成版本问题,需要手动指定下g-canvas的版本,如添加 "@antv/g-canvas": "^2.0.20",即可

posted by zackyoungh 6 months ago

我也遇到了这个问题什么都还没写呢,

"@antv/data-set": "^0.11.8", "@antv/g": "^6.1.21", "@antv/g6": "^5.0.42", "@antv/graphin": "^3.0.4", "@antv/l7": "^2.21.8", "@antv/l7-district": "^2.3.12", "@antv/larkmap": "^1.4.16",

posted by ldc2726 2 months ago

Fund this Issue

$0.00
Funded

Pull requests