ECharts 英雄联盟能力分析雷达图及支付宝信用评分雷达图

ECharts 提供了常规的折线图、柱状图、散点图、饼图、K线图，用于统计的盒形图，用于地理数据可视化的地图、热力图、线图，用于关系数据可视化的关系图、treemap，多维数据可视化的平行坐标，还有用于 BI 的漏斗图、仪表盘，并且支持图与图之间的混搭。

在 body 中添加一个 div 标签，为该 div 设置一个 id 名，并设置宽和高。 引入 echarts.js 文件

//英雄联盟能力分析雷达图： var myChartLol = echarts.init(document.getElementById("lol")); var optionLol = { radar:[{ indicator:[ {text: "击杀", max: 200}, {text: "金钱", max: 200}, {text: "防御", max: 200}, {text: "魔法", max: 200}, {text: "物理", max: 200}, {text: "助攻", max: 200}, {text: "生存", max: 200} ], radius: 100, shape: "rect", splitNumber: 4, //文字颜色 name:{ textStyle:{color: "#000", fontFamily: '行楷', fontSize: 8} }, splitLine: { lineStyle: { color: [ '#95dde2','#5cc1c7','#2d8d93','#abdada' ].reverse() } }, axisLine: { lineStyle: { color: '#abdada' } }, splitArea: { areaStyle: { color: [ '#2d8d93','#5cc1c7','#95dde2','#d5f0f2' ] } } }], series: [ { type: 'radar', data: [ { value: [130,100,160,199,80,190,180], symbolSize: 0, lineStyle: { normal: { type: 'solid', color: '#ee6049', width: 2 } } } ] } ]}; myChartLol.setOption(optionLol);

//支付宝信用评分雷达图： var Price = echarts.init(document.getElementById("price")); var optionPrice = { backgroundColor: 'rgba(27,181,226,.7)', radar: { splitNumber: 1, radius: "55%", //字体颜色 name: { textStyle: {color: '#fff'} }, //斜角分割线颜色 axisLine: { lineStyle: { color: 'rgba(255,255,255,.2)' } }, //雷达图中的背景色透明度 splitArea: { areaStyle: { opacity: 0 } }, //最外层边框颜色 splitLine: { lineStyle: { width: 1, color: 'rgba(255,255,255,.5)' } }, indicator: [ {text: '身份特质', max: 50}, {text: '行为偏好', max: 50}, {text: '人脉关系', max: 50}, {text: '信用历史', max: 50}, {text: '履约能力', max: 50} ]}, series: [ { type: 'radar', symbolSize: 0, //填充区域颜色 areaStyle: { normal: { color: 'rgba(255,255,255,.3)' } }, data: [{ value: [48,44,45,46,46], //数据边框样式 lineStyle: { normal: { width: 1, color: 'rgba(82,206,228,1)' } } }] } ] }; Price.setOption(optionPrice);

ECharts 已经为我们提供了很多的作品示例，平常使用的一些效果只需要引用某些示例，然后根据官方文档中的配置项来修改一些样式即可达到自己想要的效果。

网址：ECharts 英雄联盟能力分析雷达图及支付宝信用评分雷达图 https://mxgxt.com/news/view/1510167

相关内容

ECharts实现雷达图详解ECharts 是一款由百度开源的数据可视化工具，它提供了丰富的图表类型，如折线图、柱状图、
3大案例告诉你如何用雷达图做分析
什么是雷达图分析（五性分析）？ – 营销学堂
员工能力分析任意员工对比雷达图
华为行业雷达图分析.pptx
94 GHz云雷达回波及测云能力分析
标杆管理中的常用工具——雷达图
数据可视化之雷达图解析
行业SPAN图 + 竞争力雷达图
英雄联盟数据分析专题（二）

随便看看