1.下载echarts安装包--npm install echarts --save
2.在结构（template）部分设置一个div--给样式宽度和高度，设置ref（目的为了获取操作"DOM"）
3.引入eacharts---var echarts=require（'echart'）
4..在vue生命周期mounted创建图表实例--const xxx=echarts.init(this.$refs.myDiv)
5.使用第四步保存的变量--采取setOption（）方法--该方法放入需要的结构即可
6.补充：具体步骤查看官网详情：
7.实列代码：--完整加载
8.方式二：采取按需引入的方式：
9.按需引入：
10.所有代码：
<template>
<!-- 雷达图 图表必须给高和宽度-->
<div ref="myDiv" class="radar-echart" />
</template>
<script>
// 完成加载过程
// var echarts = require('echarts')
//按需引入
var echarts = require('echarts/lib/echarts') // 引入echarts主模块
//这里如何去查找radar？根据install文件夹一级一级查找
require('echarts/lib/chart/radar') // 引入雷达图
// 引入提示框和标题组件
require('echarts/lib/component/tooltip')
require('echarts/lib/component/title')
export default {
// 页面渲染完毕事件--注：需要在mounted才能渲染！
mounted() {
// 基于准备好的dom，初始化echarts实例
const myChart = echarts.init(this.$refs.myDiv) // 得到图表实例
//找到雷达图进行复制粘贴即可：
myChart.setOption({
title: {
text: '基础雷达图'
},
tooltip: {},
legend: {
data: ['预算分配（Allocated Budget）', '实际开销（Actual Spending）']
},
radar: {
// shape: 'circle',
name: {
textStyle: {
color: '#fff',
backgroundColor: '#999',
borderRadius: 3,
padding: [3, 5]
}
},
// 每个区域的最高值
indicator: [
{ name: '工作效率', max: 100 },
{ name: '考勤', max: 100 },
{ name: '积极性', max: 100 },
{ name: '帮助同事', max: 100 },
{ name: '自主学习', max: 100 },
{ name: '正确率', max: 100 }
]
},
series: [{
name: '预算 vs 开销（Budget vs spending）',
type: 'radar',
// areaStyle: {normal: {}},
data: [
{
value: [10, 1, 100, 5, 100, 0],
name: '张三'
},
{
value: [50, 50, 50, 50, 50, 10],
name: '李四'
}
]
}]
})
}
}
</script>
<style>
.radar-echart {
width: 600px;
height: 400px;
}
</style>
11.效果图：
