antvis/G6


The issue has been closed
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'enableTick') #5013
sylvesterdas posted onGitHub
Describe the bug
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'enableTick')
at LayoutController.eval (layout.js:134:1)
at step (tslib.es6.mjs:147:1)
at Object.eval [as next] (tslib.es6.mjs:128:1)
at eval (tslib.es6.mjs:121:1)
at new Promise (<anonymous>)
at __awaiter (tslib.es6.mjs:117:1)
at eval (layout.js:86:1)
at new Promise (<anonymous>)
at LayoutController.execLayoutMethod (layout.js:85:1)
at LayoutController.eval (layout.js:298:1)
Your Example Website or App
Steps to Reproduce the Bug or Issue
package.json
"dependencies": { "@antv/g6": "^4.8.19" ... }
package-lock.json
4.8.22
Vue 3 script
<template>
<div class="relative h-[600px] rounded border z-0 overflow-hidden p-4" id="dep-graph"></div>
</template>
<script>
import G6 from '@antv/g6'
import { defineComponent } from 'vue'
import {
legend,
minimap,
toolbar
} from '@/services/depGraphPlugins'
export default defineComponent({
name: 'DependencyGraphV2',
mounted() {
const data = {
nodes: [
{
id: 'node1',
label: 'Circle1',
x: 150,
y: 150
},
{
id: 'node2',
label: 'Circle2',
x: 400,
y: 150
}
],
edges: [
{
source: 'node1',
target: 'node2'
}
]
}
const container = document.getElementById('dep-graph')
const width = container.getBoundingClientRect().width
const height = 540
const graph = new G6.Graph({
container: container.id,
width: width,
height: height,
linkCenter: true,
plugins: [legend, minimap(width), toolbar],
modes: {
default: [
{
type: 'collapse-expand',
onChange: function onChange(item, collapsed) {
const data = item.get('model')
data.collapsed = collapsed
return true
}
},
'drag-canvas',
'zoom-canvas'
]
},
defaultNode: {
size: 26,
anchorPoints: [
[0, 0.5],
[1, 0.5]
]
},
defaultEdge: {
type: 'cubic-vertical'
},
layout: {
type: 'dendrogram',
direction: 'TB', // H / V / LR / RL / TB / BT
nodeSep: 40,
rankSep: 100
}
})
graph.node(function(node) {
let position = 'right'
let rotate = 0
if (!node.children) {
position = 'bottom'
rotate = Math.PI / 2
}
return {
label: node.id,
labelCfg: {
position,
offset: 5,
style: {
rotate,
textAlign: 'start'
}
}
}
})
graph.data(data)
graph.render() // Throws the above bug here
graph.fitView()
if (typeof window !== 'undefined') {
window.onresize = () => {
if (!graph || graph.get('destroyed')) return
if (!container || !container.scrollWidth || !container.scrollHeight) return
graph.changeSize(container.scrollWidth, container.scrollHeight)
}
}
}
})
</script>
Expected behavior
This was working few weeks back. It crashed on newer version
Screenshots or Videos
No response
Platform
- OS: Ubuntu 24 LTS
- Browser: Brave
- Version: [4.8.19]
Additional context
No response