雷达图

描述:当前是关于Echarts图表中的 雷达图 示例。
 
            option = {
   //你的代码
   backgroundColor:'#012e43',
   radar:{
      // name:{
      //    textStyle:{
      //       color:'#89b1ff',
      //       fontSize:14
      //    }
      // },
      nameGap:5,
      shape:'polygon',
      center:['40%','50%'],
      radius:'70%',
      axisLine:{
         show:false
      },
      splitLine:{
         show:true,
         lineStyle:{
            width:1,
            color:'#024882'
         }
      },
      indicator:[
         {
            // 换行
            name:'北\n京',
            max:200,
            // 单独的一个显示坐标
            axisLabel:{
               show:true,
               fontSize:12,
               margin:-25,
               color:'rgba(255,255,255,0.3)'
            }
         },
         {
            name:'上\n海',
            max:200
         },
         {
            name:'南\n京',
            max:200
         },
         {
            name:'杭\n州',
            max:200
         },
         {
            name:'天\n津',
            max:200
         }
      ],
      splitArea:{
         show:false
      }
   },
   legend:{
      orient:'vertical',
      // data:['2020','2023','2024','2035','2026','2027'],
      right:20,
      top:50,
      itemWidth:16,
      itemHeight:8,
      itemGap:15,
      textStyle:{
         fontSize:12,
         color:'#ffff'
      },
      // 图例图标自定义
      itemStyle:{
         // 设置为auto回合内容一样的颜色
         borderColor:'auto',
         borderWidth:2,
         color:'transparent',
         borderRadius:4
      }
   },
   series:[
      {
         type:'radar',
         data:[
            {
               name:'11111',
               value:[180,150,150,150,150],
               symbol:'none',
               lineStyle:{
                  color:'#f55354'
               },
               areaStyle:{
                  color:'#f55345',
                  opacity:0.1
               },
               itemStyle:{
                  color:'#f55354'
               }
            },
            {
               name:'2222',
               value:[170,160,160,160,160],
               symbol:'none',
               lineStyle:{
                  color:'#ff8600'
               },
               areaStyle:{
                  color:'#ff8600',
                  opacity:0.1
               },
               itemStyle:{
                  color:'#ff8600'
               }
            },
            {
               name:'3333',
               value:[160,170,170,170,170],
               symbol:'none',
               lineStyle:{
                  color:'#ffd800'
               },
               areaStyle:{
                  color:'#ffd800',
                  opacity:0.1
               },
               itemStyle:{
                  color:'#ffd800'
               }
            },
            {
               name:'44444',
               value:[150,180,180,180,180],
               symbol:'none',
               lineStyle:{
                  color:'#11ab84'
               },
               areaStyle:{
                  color:'#11ab84',
                  opacity:0.1
               },
               itemStyle:{
                  color:'#11ab84'
               }
            },
            {
               name:'5555',
               value:[140,185,185,185,185],
               symbol:'none',
               lineStyle:{
                  color:'#06ffff'
               },
               areaStyle:{
                  color:'#06ffff',
                  opacity:0.1
               },
               itemStyle:{
                  color:'#06ffff'
               }
            },
            {
               name:'6666',
               value:[135,190,190,190,190],
               symbol:'none',
               lineStyle:{
                  color:'#409eff'
               },
               areaStyle:{
                  color:'#409eff',
                  opacity:0.1
               },
               itemStyle:{
                  color:'#409eff'
               }
            },
            {
               name:'77777',
               value:[130,195,195,195,195],
               symbol:'none',
               lineStyle:{
                  color:'#404dff'
               },
               areaStyle:{
                  color:'#404dff',
                  opacity:0.1
               },
               itemStyle:{
                  color:'#404dff'
               }
            }
         ]
      }
   ]
};