mt-fe-group/yudao-dev
13
0
Fork 0
Code Issues Pull Requests 1 Releases Wiki Activity

修改

Browse Source
This commit is contained in:
‘937886381’
2023-12-29 09:00:00 +08:00
parent 6d8889bbec
commit 9e2da2ddc2
12 changed files with 1153 additions and 1283 deletions
Download Patch File Download Diff File Expand all files Collapse all files

177
src/views/OperationalOverview/components/doubleYChart .vue
View File

@@ -1,7 +1,7 @@
<!--
* @Author: zhp
* @Date: 2023-09-21 09:06:28
* @LastEditTime: 2023-10-16 14:20:45
* @LastEditTime: 2023-12-27 18:28:45
* @LastEditors: zhp
* @Description:
-->
@@ -60,98 +60,17 @@ export default {
data() {
return {
chart: null,
series: []
nameList: [],
series: [{
type: 'bar',
data: [],
barWidth: 6
}]
}
},
mounted() {
console.log('mounted')
console.log('borderRadius: ', this.borderRadius)
this.series = [
{
name: this.dataList[0].name,
type: 'bar',
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[0].topColor },
{ offset: 1, color: this.dataList[0].bottomColor }
]),
barBorderRadius: this.borderRadius
},
data: this.dataList[0].data,
barWidth: 6
},
{
name: this.dataList[1].name,
type: 'bar',
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[1].topColor },
{ offset: 1, color: this.dataList[1].bottomColor }
]),
barBorderRadius: this.borderRadius
},
data: this.dataList[1].data,
barWidth: 6
},
{
name: this.dataList[2].name,
type: 'bar',
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[2].topColor },
{ offset: 1, color: this.dataList[2].bottomColor }
]),
// borderRadius: [5, 5, 0, 0]
barBorderRadius: this.borderRadius
},
data: this.dataList[2].data,
barWidth: 6
},
{
name: this.dataList[3].name,
type: 'bar',
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[3].topColor },
{ offset: 1, color: this.dataList[3].bottomColor }
]),
// borderRadius: [5, 5, 0, 0]
barBorderRadius: this.borderRadius
},
data: this.dataList[3].data,
barWidth: 6
},
{
name: this.dataList[4].name,
type: 'bar',
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[4].topColor },
{ offset: 1, color: this.dataList[4].bottomColor }
]),
// borderRadius: [5, 5, 0, 0]
barBorderRadius: this.borderRadius
},
data: this.dataList[4].data,
barWidth: 6
},
{
name: this.dataList[5].name,
type: 'bar',
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[5].topColor },
{ offset: 1, color: this.dataList[5].bottomColor }
]),
// borderRadius: [5, 5, 0, 0]
barBorderRadius: this.borderRadius
},
data: this.dataList[5].data,
barWidth: 6
}
]
this.$nextTick(() => {
this.initChart()
})
@@ -164,8 +83,50 @@ export default {
this.chart = null
},
methods: {
initChart() {
console.log(1)
initChart(nameList, passRateList, outputNumList) {
let series= [
{
name: '产线产量',
type: 'bar',
yAxisIndex: 1,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#9DD5FF' },
{ offset: 1, color: '#1295FF' }
])
// barBorderRadius: this.borderRadius
},
barWidth: 12,
data: outputNumList
},
{
name: '产线良品率',
type: 'line',
yAxisIndex: 0,
areaStyle: {
opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: 'rgba(255, 209, 96, 0.18)'
},
{
offset: 1,
color: 'rgba(255, 234, 153, 0)'
}
])
},
itemStyle: {
normal: {
color: 'rgba(255, 209, 96, 1)', //改变折线点的颜色
lineStyle: {
color: 'rgba(255, 209, 96, 1)' //改变折线颜色
}
}
},
data: passRateList
}
]
const colors = ['#5470C6', '#91CC75', '#EE6666']
this.chart = echarts.init(document.getElementById(this.id))
this.chart.setOption({
@@ -177,7 +138,12 @@ export default {
}
},
grid: {
right: '20%'
left: "3%",
right: "4%",
bottom: "3%",
width: 'auto',
height: "auto",
containLabel: true
},
legend: {
data: ['产线产量', '产线良品率'],
@@ -205,7 +171,7 @@ export default {
color: '#213259'
}
},
data: ['钢一线', '钢二线', '钢三线', '钢四线', '钢五线', '钢六线', '钢七线', '钢八线']
data: nameList
},
// yAxis: {
@@ -236,8 +202,7 @@ export default {
axisLabel: {
textStyle: {
color: '#ced1d5', // 坐标值得具体的颜色
formatter: '{value} 片'
formatter: '{value}%'
}
},
splitLine: {
@@ -295,29 +260,7 @@ export default {
// },
}
],
series: [
{
name: '产线产量',
type: 'bar',
yAxisIndex: 1,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#9DD5FF' },
{ offset: 1, color: '#1295FF' }
])
// barBorderRadius: this.borderRadius
},
data: [
2032, 3032, 1802, 2932, 2322, 2613, 2873, 2561
]
},
{
name: '产线良品率',
type: 'line',
yAxisIndex: 0,
data: [98, 97, 94, 97.6, 98.2, 98.2, 97.4, 98.5]
}
]
series: series
})
}
}