|
|
@@ -1,5 +1,7 @@
|
|
|
<template>
|
|
|
- <div style="width: 100%; height: 160px" id="radar"></div>
|
|
|
+ <div>
|
|
|
+ <div style="width: 100%; height: 160px" id="radar"></div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -19,17 +21,22 @@ export default {
|
|
|
radarChart.value.setOption(option.value);
|
|
|
}
|
|
|
|
|
|
+ function updateData(data = [300, 900, 800, 100, 700]) {
|
|
|
+ option.value.series[0].data[0].value = data;
|
|
|
+ radarChart.value.setOption(option.value);
|
|
|
+ }
|
|
|
+
|
|
|
let option = ref({
|
|
|
title: {},
|
|
|
radar: {
|
|
|
center: ["50%", 90],
|
|
|
// shape: 'circle',
|
|
|
indicator: [
|
|
|
- { name: "数据1", max: 6500 },
|
|
|
- { name: "数据2", max: 16000 },
|
|
|
- { name: "数据3", max: 30000 },
|
|
|
- { name: "数据4", max: 38000 },
|
|
|
- { name: "数据5", max: 52000 },
|
|
|
+ { name: "数据1", max: 1000 },
|
|
|
+ { name: "数据2", max: 1000 },
|
|
|
+ { name: "数据3", max: 1000 },
|
|
|
+ { name: "数据4", max: 1000 },
|
|
|
+ { name: "数据5", max: 1000 },
|
|
|
],
|
|
|
axisLine: {
|
|
|
// (圆内的几条直线)坐标轴轴线相关设置
|
|
|
@@ -69,7 +76,7 @@ export default {
|
|
|
type: "radar",
|
|
|
data: [
|
|
|
{
|
|
|
- value: [4200, 3000, 20000, 35000, 50000],
|
|
|
+ value: [650, 300, 100, 900, 500],
|
|
|
},
|
|
|
],
|
|
|
areaStyle: {
|
|
|
@@ -91,6 +98,7 @@ export default {
|
|
|
return {
|
|
|
init,
|
|
|
exchangeUrl,
|
|
|
+ updateData,
|
|
|
};
|
|
|
},
|
|
|
};
|