mirror of
https://gitee.com/dolphinscheduler/DolphinScheduler.git
synced 2024-12-02 12:17:43 +08:00
beautify the dag (#12728)
This commit is contained in:
parent
7f3193643a
commit
cb3a38332f
@ -19,7 +19,7 @@ export const X6_NODE_NAME = 'dag-task'
|
||||
export const X6_EDGE_NAME = 'dag-edge'
|
||||
export const X6_PORT_OUT_NAME = 'dag-port-out'
|
||||
|
||||
const EDGE_COLOR = '#999999'
|
||||
const EDGE_COLOR = '#A2B1C3'
|
||||
const BG_BLUE = '#DFE9F7'
|
||||
const BG_WHITE = '#FFFFFF'
|
||||
const NODE_BORDER = '#CCCCCC'
|
||||
@ -72,7 +72,7 @@ export const PORT = {
|
||||
},
|
||||
'circle-outer': {
|
||||
stroke: NODE_BORDER,
|
||||
strokeWidth: 1,
|
||||
strokeWidth: 2,
|
||||
r: 6,
|
||||
fill: BG_WHITE
|
||||
},
|
||||
@ -164,7 +164,7 @@ export const NODE = {
|
||||
pointerEvents: 'visiblePainted',
|
||||
fill: BG_WHITE,
|
||||
stroke: NODE_BORDER,
|
||||
strokeWidth: 1,
|
||||
strokeWidth: 2,
|
||||
strokeDasharray: 'none',
|
||||
filter: 'none'
|
||||
},
|
||||
@ -178,7 +178,7 @@ export const NODE = {
|
||||
refX: 45,
|
||||
refY: 18,
|
||||
fontFamily: 'Microsoft Yahei',
|
||||
fontSize: 12,
|
||||
fontSize: 15,
|
||||
fontWeight: 'bold',
|
||||
fill: TITLE,
|
||||
strokeWidth: 0
|
||||
@ -236,12 +236,12 @@ export const EDGE = {
|
||||
attrs: {
|
||||
line: {
|
||||
stroke: EDGE_COLOR,
|
||||
strokeWidth: 1,
|
||||
strokeWidth: 1.5,
|
||||
targetMarker: {
|
||||
tagName: 'path',
|
||||
fill: EDGE_COLOR,
|
||||
strokeWidth: 0,
|
||||
d: 'M 6 -3 0 0 6 3 Z'
|
||||
d: 'M 7 -5 0 0 7 5 Z'
|
||||
},
|
||||
filter: 'none'
|
||||
}
|
||||
@ -250,9 +250,10 @@ export const EDGE = {
|
||||
name: 'rounded'
|
||||
},
|
||||
router: {
|
||||
name: 'manhattan',
|
||||
name: 'er',
|
||||
args: {
|
||||
endDirections: ['top', 'bottom', 'left']
|
||||
offset: 15,
|
||||
direction: 'H',
|
||||
}
|
||||
},
|
||||
defaultLabel: {
|
||||
@ -269,7 +270,7 @@ export const EDGE = {
|
||||
attrs: {
|
||||
label: {
|
||||
fill: EDGE_COLOR,
|
||||
fontSize: 14,
|
||||
fontSize: 16,
|
||||
textAnchor: 'middle',
|
||||
textVerticalAnchor: 'middle',
|
||||
pointerEvents: 'none'
|
||||
@ -278,7 +279,7 @@ export const EDGE = {
|
||||
ref: 'label',
|
||||
fill: BG_WHITE,
|
||||
stroke: EDGE_COLOR,
|
||||
strokeWidth: 1,
|
||||
strokeWidth: 2,
|
||||
rx: 4,
|
||||
ry: 4,
|
||||
refWidth: '140%',
|
||||
@ -326,7 +327,7 @@ export const EDGE_SELECTED = {
|
||||
targetMarker: {
|
||||
fill: STROKE_BLUE
|
||||
},
|
||||
strokeWidth: 2,
|
||||
strokeWidth: 3,
|
||||
filter: EDGE_SHADOW
|
||||
}
|
||||
},
|
||||
|
@ -75,9 +75,9 @@ export function useCanvasInit(options: Options) {
|
||||
minimap: {
|
||||
enabled: true,
|
||||
container: minimap.value,
|
||||
scalable: false,
|
||||
width: 200,
|
||||
height: 120
|
||||
scalable: true,
|
||||
width: 250,
|
||||
height: 150
|
||||
},
|
||||
interacting: {
|
||||
edgeLabelMovable: false,
|
||||
@ -108,10 +108,10 @@ export function useCanvasInit(options: Options) {
|
||||
const { sourceCell, targetCell } = data
|
||||
|
||||
if (
|
||||
sourceCell &&
|
||||
targetCell &&
|
||||
sourceCell.isNode() &&
|
||||
targetCell.isNode()
|
||||
sourceCell &&
|
||||
targetCell &&
|
||||
sourceCell.isNode() &&
|
||||
targetCell.isNode()
|
||||
) {
|
||||
const sourceData = sourceCell.getData()
|
||||
if (!sourceData) return true
|
||||
@ -135,10 +135,10 @@ export function useCanvasInit(options: Options) {
|
||||
edge?.setAttrs({
|
||||
line: {
|
||||
strokeDasharray:
|
||||
sourceData.taskExecuteType === 'STREAM' ||
|
||||
targetData.taskExecuteType === 'STREAM'
|
||||
? '5 5'
|
||||
: 'none'
|
||||
sourceData.taskExecuteType === 'STREAM' ||
|
||||
targetData.taskExecuteType === 'STREAM'
|
||||
? '5 5'
|
||||
: 'none'
|
||||
}
|
||||
})
|
||||
return true
|
||||
|
Loading…
Reference in New Issue
Block a user