107 lines
2.4 KiB
Vue
107 lines
2.4 KiB
Vue
<!--
|
|
* @Author: your name
|
|
* @Date: 2021-06-28 15:31:00
|
|
* @LastEditTime: 2021-06-29 21:05:31
|
|
* @LastEditors: Please set LastEditors
|
|
* @Description: In User Settings Edit
|
|
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\ProcessData\Three.vue
|
|
-->
|
|
<template>
|
|
<div>
|
|
<div id="main" style="width: 1000px;height: 800px;" />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import echarts from 'echarts'
|
|
export default {
|
|
data() {
|
|
return {
|
|
key: 11111
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getData()
|
|
},
|
|
methods: {
|
|
async getData() {
|
|
var chartDom = document.getElementById('main')
|
|
var myChart = echarts.init(chartDom)
|
|
var option
|
|
option = {
|
|
title: {
|
|
text: '钢化炉影响因素对比图',
|
|
top: 10,
|
|
left: 10
|
|
},
|
|
tooltip: {
|
|
trigger: 'item',
|
|
backgroundColor: 'rgba(0,0,250,0.2)'
|
|
},
|
|
legend: {
|
|
type: 'scroll',
|
|
bottom: 10,
|
|
data: (function() {
|
|
var list = []
|
|
for (var i = 1; i < 10; i++) {
|
|
list.push('产品' + i)
|
|
}
|
|
return list
|
|
})()
|
|
},
|
|
visualMap: {
|
|
top: 'middle',
|
|
right: 10,
|
|
show: false,
|
|
color: ['red', 'blue'],
|
|
calculable: true
|
|
},
|
|
radar: {
|
|
indicator: [
|
|
{ text: '上部温度', max: 1 },
|
|
{ text: '下部温度', max: 1 },
|
|
{ text: '急冷风压', max: 1 },
|
|
{ text: '急冷时间', max: 1 },
|
|
{ text: '冷却风压', max: 1 }
|
|
]
|
|
},
|
|
series: (function() {
|
|
var series = []
|
|
for (var i = 1; i < 10; i++) {
|
|
series.push({
|
|
name: '',
|
|
type: 'radar',
|
|
symbol: 'none',
|
|
lineStyle: {
|
|
width: 1
|
|
},
|
|
emphasis: {
|
|
areaStyle: {
|
|
color: 'rgba(0,250,0,0.3)'
|
|
}
|
|
},
|
|
data: [{
|
|
value: [
|
|
(10 - i) * 0.2 * 0.5,
|
|
(10 - i) * 0.11,
|
|
i * 0.2 * 0.4,
|
|
i / 8 * 0.5,
|
|
i * 0.1
|
|
],
|
|
name: '产品' + i
|
|
}]
|
|
})
|
|
}
|
|
return series
|
|
})()
|
|
}
|
|
option && myChart.setOption(option)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
</style>
|