|
|
@@ -56,6 +56,8 @@
|
|
|
msg: 'Welcome to Your Vue.js App',
|
|
|
caseInfo: {},
|
|
|
pklinedata: {},
|
|
|
+ dataInterval: [0, 1, 3, 5, 15, 30,50,100],
|
|
|
+ yxlData2:[],
|
|
|
pklineOption: {
|
|
|
title: {
|
|
|
text: "一周因子活性变化",
|
|
|
@@ -63,48 +65,89 @@
|
|
|
},
|
|
|
calculable: true,
|
|
|
xAxis: [{
|
|
|
+ max:32,
|
|
|
+ // min:0,
|
|
|
// minInterval:1,
|
|
|
// scale:false,
|
|
|
- splitNumber:192,
|
|
|
+ splitNumber:32,
|
|
|
+ interval:1,
|
|
|
type: 'category',
|
|
|
boundaryGap: false,
|
|
|
data: [],
|
|
|
// name:"时间(小时)"
|
|
|
axisLabel:{
|
|
|
interval:0,
|
|
|
- formatter(v){
|
|
|
- if(v % 48==0){
|
|
|
- console.log(v,2222222)
|
|
|
- return v
|
|
|
- }else{
|
|
|
- return ""
|
|
|
+ formatter(v,i){
|
|
|
+ if(i==8){
|
|
|
+ return '48'
|
|
|
+ }
|
|
|
+ if(i==16){
|
|
|
+ return '96'
|
|
|
+ }
|
|
|
+ if(i==24){
|
|
|
+ return '144'
|
|
|
}
|
|
|
+ if(i==32){
|
|
|
+ return '192'
|
|
|
+ }
|
|
|
+
|
|
|
+ // if(v % 48==0){
|
|
|
+ // return v
|
|
|
+ // }else{
|
|
|
+ // return ""
|
|
|
+ // }
|
|
|
}
|
|
|
}
|
|
|
}],
|
|
|
yAxis: [{
|
|
|
name: "活性(%)",
|
|
|
type: 'value',
|
|
|
+ // splitNumber:30,
|
|
|
axisLabel: {
|
|
|
- // formatter: (v,i)=>{
|
|
|
- // if (i <= 10) {
|
|
|
- // v = i;
|
|
|
- // }else{
|
|
|
- // v=v/5
|
|
|
- // }
|
|
|
+ interval:0,
|
|
|
+ formatter: (v,i)=>{
|
|
|
+ return v
|
|
|
+ if(i===0){
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ if(i===1){
|
|
|
+ return 1;
|
|
|
+ }
|
|
|
+ if(i===2){
|
|
|
+ return 3;
|
|
|
+ }
|
|
|
+ if(i==3){
|
|
|
+ return 5;
|
|
|
+ }
|
|
|
+ if(i===4){
|
|
|
+ return 15;
|
|
|
+ }
|
|
|
+ if(i===5){
|
|
|
+ return 30;
|
|
|
+ }
|
|
|
+ if(i===6){
|
|
|
+ return 50;
|
|
|
+ }
|
|
|
+ if(i===7){
|
|
|
+ return 100;
|
|
|
+ }
|
|
|
|
|
|
- // return v
|
|
|
- // }
|
|
|
+ return v
|
|
|
+ }
|
|
|
},
|
|
|
- // max:100,
|
|
|
+ // max:30,
|
|
|
// min:0,
|
|
|
- // interval:1
|
|
|
+ // interval:1,
|
|
|
+ // splitNumber:5,
|
|
|
+ axisTick:{ //坐标轴刻度相关设置。
|
|
|
+ show :true,
|
|
|
+ },
|
|
|
}],
|
|
|
series: [{
|
|
|
name: '最低气温',
|
|
|
type: 'line',
|
|
|
showSymbol: false,
|
|
|
- data: [],
|
|
|
+ data: this.yxlData2,
|
|
|
markLine: {
|
|
|
symbol: ['none', 'none'],
|
|
|
label: {
|
|
|
@@ -316,7 +359,26 @@
|
|
|
}).then(res => {
|
|
|
this.pklinedata = res.data.data
|
|
|
this.pklineOption.xAxis[0].data = res.data.data.pk_xdata
|
|
|
+
|
|
|
+ let yxlData = res.data.data.pk_ydata
|
|
|
+ let yxlData2 = []
|
|
|
+ //计算y轴自定义刻度
|
|
|
+ for (var i = 0; i < yxlData.length; i++) {
|
|
|
+ // 1.寻找在数据间隔里小于amount的最大值
|
|
|
+ const min_v = Math.max(...this.dataInterval.filter((v) => v <= yxlData[i]));
|
|
|
+ // 2.寻找在数据间隔里大于amount的最小值
|
|
|
+ const max_v = Math.min(...this.dataInterval.filter((v) => v > yxlData[i]));
|
|
|
+ // 3.寻找 min_v 所在的下标
|
|
|
+ const index = this.dataInterval.findIndex((v) => v === min_v);
|
|
|
+ // 4.计算该amount在y轴上应该展示的位置
|
|
|
+ const y_value = ((yxlData[i] - min_v) / (max_v - min_v)) * 10 + index * 10;
|
|
|
+ yxlData2[i] = y_value;
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log(yxlData2,2222222222222)
|
|
|
this.pklineOption.series[0].data = res.data.data.pk_ydata
|
|
|
+ // this.pklineOption.series[0].data = yxlData2
|
|
|
+ // this.yxlData2 = yxlData2
|
|
|
})
|
|
|
}
|
|
|
},
|