var myChart = echarts.init(document.getElementById('report_radar_chart'));
var option = {
tooltip: {
show: false, // 不显示悬浮框
// position: ['30%', '80%'], // 显示位置
formatter: (p) => {
return `${v.creditRatTypeName}: ${p.data.value[k]}% <br/> `;
}
},
radar: {
name: {
textStyle: {
color: '#333',
borderRadius: 3,
},
formatter: (text) => { // 文字样式
var a = text.split('(')[0], b = text.split('(')[1].split(')')[0] + '%';
return `{b|${a}}
{a|${b}}`
},
rich: { // 富文本编辑，修改文字展示样式
a: {
ontSize: 14,
align: 'right',
fontWeight: 700,
lineHeight: 18
},
b: {
fontSize: 14,
align: 'right',
lineHeight: 18
}
}
},
indicator: [
{ name: '运营能力(6.27%)', max: 100, color: '#273756'},
{ name: '资本结构(11.80%)', max: 100, color: '#273756'},
{ name: '行业景气度(12.74%)', max: 100, color: '#273756'},
{ name: '经营稳定性(42.77%)', max: 100, color: '#273756'},
{ name: '盈利能力(12.74%)', max: 100, color: '#273756'},
{ name: '企业规模(16.86%)', max: 100, color: '#273756'}
],
radius: '58%',
splitArea: { // 分隔区显示颜色
areaStyle: {
color: [
'rgb(0,154,255,0.3)',
'rgb(0,154,255,0.2)',
'rgb(0,154,255,0.1)',
'rgb(0,154,255,0)',
'rgb(0,154,255,0)'
],
shadowColor: 'rgba(0, 0, 0, 0.5)',
}
},
splitLine: { // 分割线的颜色
lineStyle: {
color: ['rgb(0,136,255,0.1)']
}
},
axisLine: { // 中间射线的颜色
lineStyle: {
color: ['rgb(0,136,255,0.1)']
}
}
},
series: [{
name: '预算 vs 开销（Budget vs spending）',
type: 'radar',
data: [
{
value: [20,30,40,78,92,12],
name: '模型评级逻辑图',
areaStyle: { // 背景色
color: new echarts.graphic.LinearGradient(
//4个参数用于配置渐变色的起止位置, 这4个参数依次对应右/下/左/上四个方位. 而0 0 0 1则代表渐变色从正上方开始
1, 0, 0, 0,
[
//数组, 用于配置颜色的渐变过程. 每一项为一个对象, 包含offset和color两个参数. offset的范围是0 ~ 1, 用于表示位置
{offset: 0, color: 'rgba(0,154,255,0.5)'},
{offset: 1, color: 'rgba(0,255,161,0)'}
]
)
},
symbol: 'emptyCircle', /*曲线圆点*/
symbolSize: 0, // 曲线圆点大小
lineStyle: {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0, color: 'rgba(0,202,255,0.5)'},
{offset: 1, color: 'rgba(0,154,255,0.5)'}
]
)
}
}
]
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);