怎么加边框echarts graph配置项内容和展示
怎么给下面的18个地市MCU整体一个虚线的边框或者半透明色块，用来区分；还有单个的拖拽怎么添加；小白求大佬解答
配置项如下
option = {
backgroundColor: new echarts.graphic.RadialGradient(0.3, 0.3, 0.8, [{
offset: 0,
color: '#f7f8fa'
}, {
offset: 1,
color: '#e1e3e5'
}]),
tooltip: {},
animationDuration: 3000,
animationEasingUpdate: 'quinticInOut',
series: [{
name: '省MCU',
type: 'graph',
layout: 'none',
legendHoverLink: true,
data: [{
"id": 0,
"name": "0",
"x": '520',
"y": '150',
"symbolSize": [30, 30],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
},
}, {
"id": 1,
"name": "1",
"x": '800',
"y": '150',
"symbolSize": [30, 30],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
},
}, {
"id": 2,
"name": "2",
"x": 670,
"y": 250,
"symbolSize": [50, 50],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 3,
"name": "3",
"x": 70,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 4,
"name": "4",
"x": 140,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 5,
"name": "5",
"x": 210,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 6,
"name": "6",
"x": 280,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 7,
"name": "7",
"x": 350,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 8,
"name": "8",
"x": 420,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 9,
"name": "9",
"x": 490,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 10,
"name": "10",
"x": 560,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 11,
"name": "11",
"x": 630,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 12,
"name": "12",
"x": 700,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 13,
"name": "13",
"x": 770,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 14,
"name": "14",
"x": 840,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 15,
"name": "15",
"x": 910,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 16,
"name": "16",
"x": 980,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 17,
"name": "17",
"x": 1050,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 18,
"name": "18",
"x": 1120,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 19,
"name": "19",
"x": 1190,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}, {
"id": 20,
"name": "20",
"x": 1260,
"y": 450,
"symbolSize": [20, 20],
draggable: false,
fixed: true,
tooltip: {
formatter: "XXX：0000000<br/>XXX：0000000<br/>XXX：0000000<br/>XXX：0000000",
}
}],
links: [{
"source": "0",
"target": "2",
}, {
"source": "1",
"target": "2",
}, {
"source": "2",
"target": "3"
}, {
"source": "2",
"target": "4"
}, {
"source": "2",
"target": "5"
}, {
"source": "2",
"target": "6"
}, {
"source": "2",
"target": "7"
}, {
"source": "2",
"target": "8"
}, {
"source": "2",
"target": "9"
}, {
"source": "2",
"target": "10"
}, {
"source": "2",
"target": "11"
}, {
"source": "2",
"target": "12"
}, {
"source": "2",
"target": "13"
}, {
"source": "2",
"target": "14"
}, {
"source": "2",
"target": "15"
}, {
"source": "2",
"target": "16"
}, {
"source": "2",
"target": "17"
}, {
"source": "2",
"target": "18"
}, {
"source": "2",
"target": "19"
}, {
"source": "2",
"target": "20"
}],
focusNodeAdjacency: true,
roam: true,
label: {
normal: {
position: "bottom",
show: true,
textStyle: {
fontSize: 12
},
}
},
lineStyle: {
normal: {
opacity: 0.8,
width: 1,
curveness: 0,
color: '#000',
}
}
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
截图如下
