index.vue
1.46 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<template>
<div id="jgChart" />
</template>
<script>
export default {
data () {
return {
};
},
methods: {
drawInit () {
let datavalue = [26, 300, 2000, 1200, 800];
let ii = -1;
var chartDom = document.getElementById('jgChart');
var myChart = this.$echarts.init(chartDom);
var option;
option = {
radar: {
indicator: [
{ name: '原则监管', max: 2600 },
{ name: '时效监管', max: 2600 },
{ name: '证书监管', max: 3600 },
{ name: '年限监管', max: 2600 },
{ name: '内容监管', max: 2600 },
],
name: {
rich: {
a: {
color: '#606266'
},
b: {
color: '#409EFF',
align: 'center',
}
},
formatter: (a, b) => {
ii++;
return `{a|${a}}\n{b|${datavalue[ii]}}`
}
}
},
series: [
{
type: 'radar',
symbol: 'none',//去掉拐点的圈
itemStyle: {
color: '#409EFF'
},
data: [
{
value: datavalue,
}
]
}
]
};
myChart.setOption(option);
}
},
mounted () {
this.drawInit()
}
}
</script>
<style scoped>
#jgChart {
width: 100%;
height: 330px;
}
</style>