export const industryFactorOption = { title: { text: '雷達圖', textStyle: { color: 'rgba(221,221,221,1)', //標題顏色 fontSize: 14, lineHeight: 20, }, // 標題的位置,此時放在圖的底邊 left: 'center', top: 'bottom', }, // 圖表的位置 grid: { position: 'center', }, tooltip : { //雷達圖的tooltip不會超出div,也可以設置position屬性,position定位的tooltip 不會隨着鼠標移動而位置變化,不友好 confine: true, enterable: true, //鼠標是否可以移動到tooltip區域內 }, radar: { shape: 'circle', splitNumber: 3, // 雷達圖圈數設置 name: { textStyle: { color: '#838D9E', }, }, // 設置雷達圖中間射線的顏色 axisLine: { lineStyle: { color: 'rgba(131,141,158,.1)', }, }, indicator: [{ name: '通信', max: 30, //若將此屬性放在radar下,則每條indicator都會顯示圈上的數值,放在這兒,只在通信這條indicator上顯示 axisLabel: { show: true, fontSize: 12, color: '#838D9E', showMaxLabel: false, //不顯示最大值,即外圈不顯示數字30 showMinLabel: true, //顯示最小數字,即中心點顯示0 }, }, { name: '零售', max: 30}, { name: '電力', max: 30}, { name: '交通', max: 30}, { name: '食品', max: 30}, { name: '建築', max: 30}, { name: '銀行', max: 30}, { name: '汽車', max: 30}, { name: '電子工程', max: 30}, ], //雷達圖背景的顏色,在這兒隨便設置了一個顏色,完全不透明度為0,就實現了透明背景 splitArea : { show : false, areaStyle : { color: 'rgba(255,0,0,0)', // 圖表背景的顏色 }, }, splitLine : { show : true, lineStyle : { width : 1, color : 'rgba(131,141,158,.1)', // 設置網格的顏色 }, }, }, series: [{ name: '雷達圖', // tooltip中的標題 type: 'radar', //表示是雷達圖 symbol: 'circle', // 拐點的樣式,還可以取值'rect','angle'等 symbolSize: 8, // 拐點的大小 areaStyle: { normal: { width: 1, opacity: 0.2, }, }, data: [ { value: [17, 24, 27, 29, 26, 16, 13, 17, 25], name: '2018-07', // 設置區域邊框和區域的顏色 itemStyle: { normal: { color: 'rgba(255,225,0,.3)', lineStyle: { color: 'rgba(255,225,0,.3)', }, }, }, //在拐點處顯示數值 label: { normal: { show: true, formatter: (params: any) => { return params.value }, }, }, }, { value: [5, 20, 19, 11, 22, 17, 8, 19, 16], name: '', itemStyle: { normal: { color: 'rgba(60,135,213,.3)', lineStyle: { width: 1, color: 'rgba(60,135,213,.3)', }, }, }, }, { value: [7, 18, 19, 13, 22, 17, 8, 25, 9], name: '', itemStyle: { normal: { color: 'rgba(255,74,74,.3)', lineStyle: { width: 1, color: 'rgba(255,74,74,.3)', }, }, }, }, ], }], } --------------------- 原文:https://blog.csdn.net/csdn_zsdf/article/details/81366738