|
@@ -33,12 +33,17 @@ export function getG6Options({ container = 'container' }) {
|
|
default: ['drag-canvas', 'drag-node', 'activate-relations']
|
|
default: ['drag-canvas', 'drag-node', 'activate-relations']
|
|
},
|
|
},
|
|
plugins: [tooltip, toolbar],
|
|
plugins: [tooltip, toolbar],
|
|
- fitView: 'autoZoom',
|
|
|
|
|
|
+ // fitView: true,
|
|
|
|
+ fitCenter: true,
|
|
layout: {
|
|
layout: {
|
|
type: 'radial',
|
|
type: 'radial',
|
|
- unitRadius: 70,
|
|
|
|
- preventOverlap: true,
|
|
|
|
- strictRadial: false
|
|
|
|
|
|
+ // linkDistance: 50, // 可选,边长
|
|
|
|
+ unitRadius: 100, // 可选
|
|
|
|
+ preventOverlap: true, // 可选,必须配合 nodeSize
|
|
|
|
+ nodeSize: 30, // 可选
|
|
|
|
+ nodeSpacing: 30, // 防止重叠时节点边缘间距的最小值
|
|
|
|
+ strictRadial: true, // 是否必须是严格的 radial 布局,及每一层的节点严格布局在一个环上。preventOverlap 为 true 时生效。
|
|
|
|
+ workerEnabled: true // 可选,开启 web-worker
|
|
},
|
|
},
|
|
defaultNode: {
|
|
defaultNode: {
|
|
size: 30,
|
|
size: 30,
|
|
@@ -195,12 +200,11 @@ G6.registerNode(
|
|
'image'
|
|
'image'
|
|
)
|
|
)
|
|
|
|
|
|
-export function getMockData() {
|
|
|
|
- const img = new Image()
|
|
|
|
- img.src = 'https://gw.alipayobjects.com/os/s/prod/antv/assets/image/logo-with-text-73b8a.svg'
|
|
|
|
|
|
+const typeImgMap = {}
|
|
|
|
|
|
|
|
+export function getMockData() {
|
|
// img.onload = draw
|
|
// img.onload = draw
|
|
- const imgs = ['C.svg', 'Elastic.svg', 'Hadoop.svg', 'Flink.svg', 'Hive.svg', 'jaeger.svg', 'python.svg', 'Docker2.svg', 'Prometheus.svg', 'java.svg']
|
|
|
|
|
|
+ const imgs = ['app.svg', 'host.svg', 'jifang.svg', 'jigui.svg', 'nginx.svg', 'SQL.svg']
|
|
|
|
|
|
const nodes = imgs.map((img, i) => {
|
|
const nodes = imgs.map((img, i) => {
|
|
if (i !== 4) {
|
|
if (i !== 4) {
|
|
@@ -208,7 +212,7 @@ export function getMockData() {
|
|
id: String(i),
|
|
id: String(i),
|
|
label: img.split(','),
|
|
label: img.split(','),
|
|
type: 'image',
|
|
type: 'image',
|
|
- size: [40, 40],
|
|
|
|
|
|
+ size: 40,
|
|
img: '/imgs/' + img
|
|
img: '/imgs/' + img
|
|
}
|
|
}
|
|
} else {
|
|
} else {
|