echarts

qq_43437334

于 2023-04-27 07:30:06 发布

阅读量69

点赞数

文章标签： echarts javascript 前端

本文链接：https://blog.csdn.net/qq_43437334/article/details/130398147

版权

文章展示了如何配置一个基础的雷达图，包括背景颜色、标题、提示信息和图例。雷达图的数据指标涉及销售、管理员工形象、信息技术提升、客服评价、研发预算和市场开发。通过对1992年和2001年的数据对比，显示了预算与开销的变化。

摘要由CSDN通过智能技术生成

option = {
backgroundColor:‘white’,
title: {
text: ‘基础雷达图’,
show: false,
},
tooltip: {},
legend: {
data: [‘1992’, ‘2001’]
},
radar: {
axisName: {
// textStyle: {
color: ‘black’,
// borderRadius: 3,
// padding: [3, 5]
// },

formatter: function(value) {
let list = value.split(“”);
let text = [];
let result= ‘’;
for(let i=3;i<=list.length-2;i++) {
text.push(list[i]);
}
if(list[1]‘a’) {
for(let j=1;j<=text.length;j++) {
result +=text[j-1];
}
}
if(list[1]‘b’) {
for(let j=1;j<=text.length;j++) {
if(!(j%3)&&text[j]!=undefined) {
result += text[j-1]+‘\n’;
}else {
result += text[j-1];
}
}
}
if(list[1]==‘c’) {
for(let j=1;j<=text.length;j++) {
if(!(j%4)&&text[j]!=undefined) {
result += text[j-1]+‘\n’;
}else {
result += text[j-1];
}
}
}

              return list[0]+list[1]+list[2]+result+list[list.length-1];
            },


            rich: {
              a: {
                color:'red'
              },
              b: {
                color: 'blue',
                // align: 'left',
              },
              c: {
                color:'black'
              }
            },
        
    },
    indicator: [{
        name: '{a|销售啦信息（不需要换行)}',
        max: 6500
    }, {
        name: '{b|管理员工形象啊}\n111',
        max: 16000
    }, {
        name: '{b|信息技术技术与提升}',
        max: 30000
    }, {
        name: '{a|客服及相关评价}',
        max: 38000
    }, {
        name: '{c|研发预算开发}',
        max: 52000
    }, {
        name: '{c|市场及前景开发}',
        max: 25000
    }]
},
series: [{
    name: '预算 vs 开销（Budget vs spending）',
    type: 'radar',
    // areaStyle: {normal: {}},
    data: [{
        value: [3300, 10000, 28000, 35000, 50000, 19000],
        name: '1992'
    }, {
        value: [5000, 14000, 28000, 31000, 42000, 21000],
        name: '2001'
    }],
}]

}