OMC/fe.ems.vue3
1
0
Fork 0
Code Issues Releases 3 Activity

fix: 注释打包异常问题

Browse Source
This commit is contained in:
TsMask
2023-12-15 18:23:59 +08:00
parent 44c05e964e
commit dfe06e2098
2 changed files with 230 additions and 230 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
src/components/ChartGraphG6/index.vue
View File

@@ -199,12 +199,12 @@ const data = {
{ {
id: '0-upf', id: '0-upf',
source: '0', source: '0',
target: 'combo-upf', target: 'combo-upf',
}, },
{ {
id: 'upf-1', id: 'upf-1',
source: 'combo-upf', source: 'combo-upf',
target: '1', target: '1',
}, },
{ {
@@ -235,22 +235,22 @@ const data = {
{ {
id: '120-180', id: '120-180',
source: '120', source: '120',
target: '180', target: '180',
}, },
{ {
id: '130-180', id: '130-180',
source: '130', source: '130',
target: '180', target: '180',
}, },
{ {
id: '140-150', id: '140-150',
source: '140', source: '140',
target: '150', target: '150',
}, },
{ {
id: '140-110', id: '140-110',
source: '140', source: '140',
target: '110', target: '110',
}, },
{ {
id: '120-150', id: '120-150',
@@ -357,20 +357,20 @@ function initChart() {
modes: { modes: {
default: ['drag-canvas', 'zoom-canvas', 'drag-node'], // 允许拖拽画布、放缩画布、拖拽节点 default: ['drag-canvas', 'zoom-canvas', 'drag-node'], // 允许拖拽画布、放缩画布、拖拽节点
}, },
// 布局 力向吸引 // // 布局 力向吸引
layout: { // layout: {
type: 'force', // 指定为力导向布局 // type: 'force', // 指定为力导向布局
preventOverlap: true, // 防止节点重叠 // preventOverlap: true, // 防止节点重叠
linkDistance: 100, // 指定边距离为100 // linkDistance: 100, // 指定边距离为100
}, // },
// 插件 // // 插件
plugins: [ // plugins: [
{ // {
// 避免文本过于密集导致的视觉混乱 // // 避免文本过于密集导致的视觉混乱
type: 'lod-controller', // type: 'lod-controller',
disableLod: true, // disableLod: true,
}, // },
] as any, // ] as any,
// 全局节点 矩形 // 全局节点 矩形
defaultNode: { defaultNode: {
type: 'rect', type: 'rect',
@@ -401,40 +401,40 @@ function initChart() {
lineWidth: 1, lineWidth: 1,
}, },
}, },
// 节点状态 // // 节点状态
nodeState: { // nodeState: {
breathing: { // breathing: {
haloShape: { // haloShape: {
opacity: 0.25, // opacity: 0.25,
lineWidth: 20, // lineWidth: 20,
visible: true, // visible: true,
}, // },
keyShape: { // keyShape: {
radius: 4, // radius: 4,
}, // },
}, // },
scaling: { // scaling: {
keyShape: { // keyShape: {
width: 100, // width: 100,
height: 60, // height: 60,
}, // },
}, // },
} as any, // } as any,
edgeState: { // edgeState: {
growing: { // growing: {
keyShape: { // keyShape: {
lineWidth: 2, // lineWidth: 2,
lineDash: ['100%', 0], // lineDash: ['100%', 0],
}, // },
}, // },
running: { // running: {
keyShape: { // keyShape: {
lineWidth: 2, // lineWidth: 2,
lineDash: [2, 2], // lineDash: [2, 2],
// TODO: lineDashOffset // // TODO: lineDashOffset
}, // },
}, // },
}, // },
}); });
graph.data(data); // 加载数据 graph.data(data); // 加载数据

352
src/views/monitor/topology/index.vue
View File

@@ -492,184 +492,184 @@ function initChart() {
nodeClusterBy: 'parentId', nodeClusterBy: 'parentId',
clusterNodeStrength: 80, clusterNodeStrength: 80,
}, },
// 主题 // // 主题
theme: { // theme: {
type: 'spec', // type: 'spec',
base: 'light', // base: 'light',
specification: { // specification: {
node: { // node: {
dataTypeField: 'parentId', // dataTypeField: 'parentId',
}, // },
}, // },
} as any, // } as any,
// 插件 // // 插件
plugins: [ // plugins: [
{ // {
// 避免文本过于密集导致的视觉混乱 // // 避免文本过于密集导致的视觉混乱
type: 'lod-controller', // type: 'lod-controller',
disableLod: true, // disableLod: true,
}, // },
] as any, // ] as any,
// 全局节点 矩形 // // 全局节点 矩形
node: model => { // node: model => {
const { id, data } = model; // const { id, data } = model;
return { // return {
id, // id,
data: { // data: {
type: 'rect-node', // type: 'rect-node',
keyShape: { // keyShape: {
width: 80, // width: 80,
height: 40, // height: 40,
radius: 8, // radius: 8,
}, // },
labelShape: { // labelShape: {
position: 'center', // position: 'center',
text: `${id} - ${data.label}`, // text: `${id} - ${data.label}`,
fill: '#fff', // fill: '#fff',
}, // },
animates: { // animates: {
update: [ // update: [
{ // {
fields: ['opacity'], // fields: ['opacity'],
shapeId: 'haloShape', // shapeId: 'haloShape',
states: ['breathing'], // states: ['breathing'],
iterations: Infinity, // iterations: Infinity,
direction: 'alternate', // direction: 'alternate',
duration: 500, // duration: 500,
}, // },
{ // {
fields: ['lineWidth'], // fields: ['lineWidth'],
shapeId: 'keyShape', // shapeId: 'keyShape',
states: ['breathing'], // states: ['breathing'],
iterations: Infinity, // iterations: Infinity,
direction: 'alternate', // direction: 'alternate',
duration: 500, // duration: 500,
}, // },
{ // {
fields: ['height', 'width'], // fields: ['height', 'width'],
shapeId: 'keyShape', // shapeId: 'keyShape',
states: ['scaling'], // states: ['scaling'],
iterations: Infinity, // iterations: Infinity,
direction: 'alternate', // direction: 'alternate',
duration: 500, // duration: 500,
}, // },
], // ],
}, // },
...data, // ...data,
}, // },
}; // };
}, // },
// 全局边 三次贝塞尔曲线 // // 全局边 三次贝塞尔曲线
edge: model => { // edge: model => {
const { id, source, target, data } = model; // const { id, source, target, data } = model;
return { // return {
id, // id,
source, // source,
target, // target,
data: { // data: {
type: 'polyline-edge', // type: 'polyline-edge',
animates: { // animates: {
update: [ // update: [
{ // {
fields: ['lineDash'], // fields: ['lineDash'],
shapeId: 'keyShape', // shapeId: 'keyShape',
states: ['growing', 'running'], // states: ['growing', 'running'],
iterations: Infinity, // iterations: Infinity,
duration: 2000, // duration: 2000,
}, // },
{ // {
fields: ['offsetDistance'], // fields: ['offsetDistance'],
shapeId: 'buShape', // shapeId: 'buShape',
states: ['circleRunning'], // states: ['circleRunning'],
iterations: Infinity, // iterations: Infinity,
duration: 2000, // duration: 2000,
}, // },
], // ],
}, // },
...data, // ...data,
}, // },
}; // };
}, // },
// 全局框节点 矩形 // // 全局框节点 矩形
combo: model => { // combo: model => {
const { id, data } = model; // const { id, data } = model;
return { // return {
id, // id,
data: { // data: {
type: 'rect-combo', // type: 'rect-combo',
keyShape: { // keyShape: {
opacity: 0.8, // opacity: 0.8,
padding: [20, 20, 20, 20], // padding: [20, 20, 20, 20],
radius: 8, // radius: 8,
}, // },
labelShape: { // labelShape: {
text: data.label, // text: data.label,
offsetY: 8, // offsetY: 8,
}, // },
labelBackgroundShape: {}, // labelBackgroundShape: {},
buildIn: [ // buildIn: [
{ // {
fields: ['opacity'], // fields: ['opacity'],
duration: 500, // duration: 500,
delay: 500 + Math.random() * 500, // delay: 500 + Math.random() * 500,
}, // },
], // ],
buildOut: [ // buildOut: [
{ // {
fields: ['opacity'], // fields: ['opacity'],
duration: 200, // duration: 200,
}, // },
], // ],
animates: { // animates: {
update: [ // update: [
{ // {
fields: ['width', 'height', 'x', 'y'], // fields: ['width', 'height', 'x', 'y'],
shapeId: 'keyShape', // shapeId: 'keyShape',
}, // },
], // ],
}, // },
...data, // ...data,
}, // },
}; // };
}, // },
// 节点状态 // 节点状态
nodeState: { // nodeState: {
breathing: { // breathing: {
haloShape: { // haloShape: {
opacity: 0.25, // opacity: 0.25,
lineWidth: 20, // lineWidth: 20,
visible: true, // visible: true,
}, // },
keyShape: { // keyShape: {
radius: 4, // radius: 4,
}, // },
}, // },
scaling: { // scaling: {
keyShape: { // keyShape: {
width: 100, // width: 100,
height: 60, // height: 60,
}, // },
}, // },
} as any, // } as any,
edgeState: { // edgeState: {
growing: { // growing: {
keyShape: { // keyShape: {
lineWidth: 2, // lineWidth: 2,
lineDash: ['100%', 0], // lineDash: ['100%', 0],
}, // },
}, // },
running: { // running: {
keyShape: { // keyShape: {
lineWidth: 2, // lineWidth: 2,
lineDash: [2, 2], // lineDash: [2, 2],
// TODO: lineDashOffset // // TODO: lineDashOffset
}, // },
}, // },
}, // },
data, //: graphData, // data, //: graphData,
}); });
graph.render() // graph.render()
graphChart = graph; // graphChart = graph;
} }
const actions = { const actions = {