代码如下：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

  <!-- 为ECharts准备一个具备大小（宽高）的Dom -->

    <div id="main" style="width: 600px;height:400px;"></div>

    <!-- 引入echarts.js -->

    <script src="https://cdn.bootcss.com/echarts/4.0.2/echarts.js"></script>

    <script>

    //获取容器的id并赋值给变量myChart

    var myChart = echarts.init(document.getElementById('main'));

    /*用来配置参数*/

    var option = {

             radar :{

                        indicator : [

                            {text : '个人情况\n满分15', max  : 15},

                            {text : '信用记录\n满分35', max  : 35},

                            {text : '经济实力\n满分30', max  : 30},

                            {text : '稳定情况\n满分15', max  : 15},

                            {text : '贷款情况\n满分25', max  : 25},

                            {text : '工作情况\n满分30', max  : 30},

                            {text : '家庭情况\n满分15', max  : 15},

                            {text : '保障情况\n满分15', max  : 15}

                        ],

                        radius : 130,

                        splitNumber : 10,

                        axisTick : {

                            show : true

                        }

                    }

                ,

             series :

                    {

                        type: 'radar',

                        data : [

                            {

                                value : [10,22,20,10,16,15,10,12,15],

                                label: {

                                    normal: {

                                        show: true

                                    }

                                }

                            }

                        ]

                    }

            };

     /*调用option生成图表*/

    myChart.setOption(option)

    </script>

</body>

</html>

显示效果：

Echarts 简单报表系列四：雷达图的更多相关文章

  1. Echarts 简单报表系列三：饼状图

    代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  2. Echarts 简单报表系列二：折线图

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Echarts 简单报表系列一：柱状图

    见代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  4. RDLC报表系列(四) 矩阵

    继续接上一篇的内容,本文主要是讲矩阵的内容 用到的数据源如下: DataTable dt = new DataTable(); dt.Columns.Add("FiscalYear" ...

  5. RDLC报表系列(一) 简单的动态数据绑定和配置

    RDLC系列链接 RDLC报表系列(一) 简单的动态数据绑定和配置  RDLC报表系列(二) 行分组 RDLC报表系列(三) 总计和折叠 RDLC报表系列(四) 矩阵 RDLC报表系列(五) 简单的图 ...

  6. RDLC报表系列(五) 简单的图表-柱状图

    继续接上一篇的内容,本文主要是讲图标的内容,本文就是简单的图标,复杂的柱状图和折线图在下一文章中介绍. 数据源还是上文RDLC报表系列(四) 矩阵中的相同 1.还是继续使用demo2的文件

  7. ECharts雷达图详细配置说明

    雷达图表配置说明: // 指定图表的配置项和数据 var option = { backgroundColor: 'rgba(204,204,204,0.7 )', // 背景色,默认无背景 rgba ...

  8. 用pChart生成雷达图图片

    需求 :由于工作需要,需要在一张背景图上添加这一张雷达图,之后图片可以在微信中长按保存.所以说我必须生成一张带有雷达图的图片第一反应是用百度echars雷达图做动态显示,之后截图.考虑到工作量和效率, ...

  9. Tableau绘制K线图、布林线、圆环图、雷达图

    Tableau绘制K线图.布林线.圆环图.雷达图 本文首发于博客冰山一树Sankey,去博客浏览效果更好.直接右上角搜索该标题即可 一. K线图 1.1 导入数据源 1.2 拖拽字段 将[日期]托到列 ...

随机推荐

  1. js精度误差

    之前虽然有看到过 js 精度相关的文章.但也都没有“印象深刻” ,但是今天"有幸"遇到了. 做一个项目,进行页面调试的时候, 当数量增加到3时总价格变得好长好长 立马在控制台验证了 ...

  2. 最简单的服务器和客户机（python3的编码与解码问题）

    在学习python的过程中,我越来越感觉到python2和python3之间有很多不同点,最近发现的一点就是编码问题. 在代码清单14-1和14-2中,因为作者是用python2来写得,然后我是用py ...

  3. Ural 1297 Palindrome（后缀数组+最长回文子串）

    https://vjudge.net/problem/URAL-1297 题意: 求最长回文子串. 思路: 先将整个字符串反过来写在原字符串后面,中间需要用特殊字符隔开,那么只需要某两个后缀的最长公共 ...

  4. 微信小程序--bind 和catch区别

    冒泡事件,当点击最里面的事件的时候,外面有事件也会执行,如3>2>1, 点击2时,2>1, 点击 最外层时 1. 1. bind事件  2.catch事件 catch事件是一个单独的 ...

  5. 【Selenium2】【项目实战】

    [public/login.py] from selenium import webdriverfrom selenium.webdriver.common.by import Byimport ti ...

  6. QQ帐户的申请与登陆-（字符串操作）

    题目: 实现QQ新帐户申请和老帐户登陆的简化版功能.最大挑战是:据说现在的QQ号码已经有10位数了. 输入格式: 输入首先给出一个正整数N(≤10^5),随后给出N行指令.每行指令的格式为:“命令符( ...

  7. _equipment

    该表控制切换地图自动更换装备,离开该地图时,装备自动切换为原来.,HEAD - TABARD小于0时取下装备,等于0时不更换,大于0时更换为对应装备. comment 备注 class 职业索引 1- ...

  8. Codeforces 786 C. Till I Collapse

    题目链接:http://codeforces.com/contest/786/problem/C 大力膜了一发杜教的代码感觉十分的兹瓷啊! 我们知道如果$k$是给定的我们显然是可以直接一遍$O(n)$ ...

  9. spring框架 AOP核心详解

    AOP称为面向切面编程,在程序开发中主要用来解决一些系统层面上的问题,比如日志,事务,权限等待,Struts2的拦截器设计就是基于AOP的思想,是个比较经典的例子. 一 AOP的基本概念 (1)Asp ...

  10. Codeforces 801C - Voltage Keepsake

    C. Voltage Keepsake 题目链接:http://codeforces.com/problemset/problem/801/C time limit per test 2 second ...