|
@@ -33,6 +33,17 @@
|
|
|
<script>
|
|
|
import centreLeft1Chart from "./echart/centerLeft2/centreLeft1Chart";
|
|
|
export default {
|
|
|
+ props: {
|
|
|
+ monthData: {},
|
|
|
+ width: {
|
|
|
+ type: String,
|
|
|
+ default: '100%'
|
|
|
+ },
|
|
|
+ height: {
|
|
|
+ type: String,
|
|
|
+ default: '2.2rem'
|
|
|
+ }
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
config: {
|
|
@@ -108,6 +119,7 @@ export default {
|
|
|
this.initTwoChart();
|
|
|
this.initThreeChart();
|
|
|
this.initFourChart();
|
|
|
+ console.log('aaaa',this.monthData)
|
|
|
},
|
|
|
methods: {
|
|
|
changeTiming() {
|
|
@@ -124,7 +136,12 @@ export default {
|
|
|
initOneChart() {
|
|
|
// 基于准备好的dom,初始化echarts实例
|
|
|
this.chart = this.echarts.init(document.getElementById('oneGTGyChart'))
|
|
|
-
|
|
|
+ const dateDay = [];
|
|
|
+ const dateNum = [];
|
|
|
+ for (let i = 0; i < this.monthData.length; i++) {
|
|
|
+ dateDay[i] = this.monthData[i].dateDay
|
|
|
+ dateNum[i] = this.monthData[i].gtg1Lv
|
|
|
+ }
|
|
|
this.chart.setOption({
|
|
|
/* 周围边距 */
|
|
|
grid: {
|
|
@@ -136,14 +153,16 @@ export default {
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
- data: ['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']
|
|
|
+ // data: ['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']
|
|
|
+ data:dateDay
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value'
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ // data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ data:dateNum,
|
|
|
type: 'line',
|
|
|
itemStyle: {
|
|
|
color: 'rgb(78,109,60)'
|
|
@@ -168,6 +187,12 @@ export default {
|
|
|
initTwoChart() {
|
|
|
// 基于准备好的dom,初始化echarts实例
|
|
|
this.chart = this.echarts.init(document.getElementById('twoGTGyChart'))
|
|
|
+ const dateDay = [];
|
|
|
+ const dateNum = [];
|
|
|
+ for (let i = 0; i < this.monthData.length; i++) {
|
|
|
+ dateDay[i] = this.monthData[i].dateDay
|
|
|
+ dateNum[i] = this.monthData[i].gtg2Lv
|
|
|
+ }
|
|
|
|
|
|
this.chart.setOption({
|
|
|
/* 周围边距 */
|
|
@@ -180,14 +205,16 @@ export default {
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
- data: ['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']
|
|
|
+ // data: ['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']
|
|
|
+ data:dateDay
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value'
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ // data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ data:dateNum,
|
|
|
type: 'line',
|
|
|
itemStyle: {
|
|
|
color: 'rgb(24,56,255)'
|
|
@@ -212,6 +239,12 @@ export default {
|
|
|
initThreeChart() {
|
|
|
// 基于准备好的dom,初始化echarts实例
|
|
|
this.chart = this.echarts.init(document.getElementById('threeGTGyChart'))
|
|
|
+ const dateDay = [];
|
|
|
+ const dateNum = [];
|
|
|
+ for (let i = 0; i < this.monthData.length; i++) {
|
|
|
+ dateDay[i] = this.monthData[i].dateDay
|
|
|
+ dateNum[i] = this.monthData[i].gtg3Lv
|
|
|
+ }
|
|
|
|
|
|
this.chart.setOption({
|
|
|
/* 周围边距 */
|
|
@@ -224,14 +257,16 @@ export default {
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
- data: ['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']
|
|
|
+ // data: ['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']
|
|
|
+ data:dateDay
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value'
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ // data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ data:dateNum,
|
|
|
type: 'line',
|
|
|
itemStyle: {
|
|
|
color: 'rgb(142,161,131)'
|
|
@@ -256,6 +291,12 @@ export default {
|
|
|
initFourChart() {
|
|
|
// 基于准备好的dom,初始化echarts实例
|
|
|
this.chart = this.echarts.init(document.getElementById('fourGTGyChart'))
|
|
|
+ const dateDay = [];
|
|
|
+ const dateNum = [];
|
|
|
+ for (let i = 0; i < this.monthData.length; i++) {
|
|
|
+ dateDay[i] = this.monthData[i].dateDay
|
|
|
+ dateNum[i] = this.monthData[i].stg1Lv
|
|
|
+ }
|
|
|
|
|
|
this.chart.setOption({
|
|
|
/* 周围边距 */
|
|
@@ -268,14 +309,16 @@ export default {
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
- data: ['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']
|
|
|
+ // data: ['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']
|
|
|
+ data:dateDay
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value'
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ // data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
|
|
|
+ data:dateNum,
|
|
|
type: 'line',
|
|
|
itemStyle: {
|
|
|
color: 'rgb(60,95,109)'
|