echart雷达图，自定义提示数据

最新推荐文章于 2024-10-05 10:37:48 发布

低_调_哥

最新推荐文章于 2024-10-05 10:37:48 发布

阅读量1.2w

点赞数 1

分类专栏： js

本文链接：https://blog.csdn.net/caiyongshengCSDN/article/details/79616865

版权

js 专栏收录该内容

54 篇文章 0 订阅

订阅专栏

echart:雷达图

radarChartOption = {
    title : {
        // text: '清单费用构成',
        textStyle:{
            fontWeight:'normal',
            fontSize:'14',
            color:'#666'
        },
        x:'center',
        y:'15'
    },
    tooltip : {
        trigger: 'axis',
        padding:10,
        formatter:function(params){
            var data = '';
            $.each(params,function (index,item) {
                data += item.name+':'+item.value+'&nbsp;万元 '+ '<br/>';
            });
            return params[0].indicator+'<br/>'+data;
        }
    },
    polar : [
        {
            radius:95,   //半径
            center:['50%','50%'], // 图的位置
            name:{
                // show: true, // 是否文字
                // formatter: null, // 文字的显示形式
                textStyle: {
                    color:'#999'   // 文字颜色
                }
            },
            indicator : [
                { text: '建筑面积', max: 6000},
                { text: '主体结构面积', max: 16000},
                { text: '出入口通道面积', max: 30000},
                { text: '基坑埋深', max: 38000},
                { text: '车站长度', max: 52000},
                { text: '标准段宽', max: 32000}
            ],
            splitArea : {
                show : true,
                areaStyle : {
                    color: ["#f8f8f8","#e9e9e9"]  // 图表背景网格区域的颜色
                }
            },
            splitLine : {
                show : true,
                lineStyle : {
                    width : 1,
                    color : '#dbdbdb' // 图表背景网格线的颜色
                }
            }
        }
    ],
    calculable : true,
    series : [
        {
            name: '',
            type: 'radar',
            symbol:'emptyCircle',  /*曲线圆点*/
            symbolSize:4,
            data : [
                {
                    value : [4300, 8000, 18000, 35000, 40000, 19000,18000],
                    name: '模拟站',
                    totalNumber:1000,
                    itemStyle: {
                        normal: {
                            color : "#f4bc65"   // 图表中各个图区域的边框线颜色
                        }
                    }
                },
                {
                    value : [4000, 11000, 21000, 31000, 42000, 21000,11000],
                    name: '系统指标 ',
                    totalNumber:1000,
                    itemStyle: {
                        normal: {
                            color : "#e15c64" // 图表中各个图区域的边框线拐点颜色
                        }
                    }
                }
            ]
        }
    ]
};

附图：