shaojiahao
/
ShangHai-YuAn
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

[完善] 根据年月查询 更新echarts视图

master
陈鹏飞 4 years ago
parent
5363dd7c99
commit
33ead45cff
2 changed files with 63 additions and 28 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/app/statistic-analysis/state/page-two-time/page-two-time.component.html
  2. 85
      src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts

2
src/app/statistic-analysis/state/page-two-time/page-two-time.component.html
Unescape View File

@ -11,7 +11,7 @@
<div class="header">
<div class="queryField" *ngIf="!isQuery && echartsData.statefulInspectionToggle">
<mat-radio-group [(ngModel)]="selectType">
<mat-radio-group [(ngModel)]="selectType" (change)='changeTime($event)'>
<mat-radio-button value="month">月</mat-radio-button>
<mat-radio-button value="year" style="margin-left: 10px;">年</mat-radio-button>
</mat-radio-group>

85
src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts
Unescape View File

@ -46,12 +46,18 @@ export class PageTwoTimeComponent implements OnInit {
selectType:string = 'month'; //选择当前的 查询类型 按月/年
changeTime (e) {
let data = e.value
this.appEcharts.changeTime(data)
}
//查询数据
years:any = []
selectMonth:any = [1,2,3,4,5,6,7,8,9,10,11,12]
tiaoshiPao:any
datayuey=[270, 253, 244, 199, 189, 173, 160, 198,200]
datayuex=['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月']
//气泡提示数据获取
bianli(){
var arrshuzu='[';
@ -61,8 +67,6 @@ export class PageTwoTimeComponent implements OnInit {
arrshuzu=arrshuzu.substring(0,arrshuzu.length-1)
arrshuzu+=']'
this.tiaoshiPao=JSON.parse(arrshuzu)
console.log(this.tiaoshiPao)
//return tishiPao
}
//日期初始化
@ -137,8 +141,10 @@ export class echartsComponent implements OnInit {
constructor(public snackBar: MatSnackBar,private adapter: DateAdapter<any>,public echartsData:EchartsDataService) { }
tiaoshiPao:any
datayuey=[270, 253, 244, 199, 189, 173, 160, 198,200]
datayuey=[270, 253, 244, 199, 189, 173, 160, 198, 200]
datayuex=['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月']
dataYearX = ['2020','2020']
dataYearY = [1078, 936]
//气泡提示数据获取
bianli(){
var arrshuzu='[';
@ -148,8 +154,6 @@ export class echartsComponent implements OnInit {
arrshuzu=arrshuzu.substring(0,arrshuzu.length-1)
arrshuzu+=']'
this.tiaoshiPao=JSON.parse(arrshuzu)
console.log(this.tiaoshiPao)
//return tishiPao
}
ngOnInit(): void {
window.setTimeout(()=>{
@ -178,15 +182,47 @@ export class echartsComponent implements OnInit {
this.sixExample.dispose()
}
changeTime (e) {
this.oneExample.clear()
this.oneExample.dispose()
this.twoExample.clear()
this.twoExample.dispose()
this.threeExample.clear()
this.threeExample.dispose()
this.fourExample.clear()
this.fourExample.dispose()
this.fiveExample.clear()
this.fiveExample.dispose()
this.sixExample.clear()
this.sixExample.dispose()
if (e=='year') {
this.tiaoshiPao=this.echartsData.qipao(this.tiaoshiPao,this.dataYearY,this.dataYearX)
this.oneInit(this.dataYearX,this.dataYearY)
this.twoInit(this.dataYearX,this.dataYearY)
this.threeInit(this.dataYearX,this.dataYearY)
this.fourInit(this.dataYearX,this.dataYearY)
this.fiveInit(this.dataYearX,this.dataYearY)
this.sixInit(this.dataYearX,this.dataYearY)
} else {
this.tiaoshiPao=this.echartsData.qipao(this.tiaoshiPao,this.datayuey,this.datayuex)
this.oneInit()
this.twoInit()
this.threeInit()
this.fourInit()
this.fiveInit()
this.sixInit()
}
}
oneExample:any;
oneInit () {
oneInit (X=this.datayuex, Y=this.datayuey) {
this.oneExample = echarts.init(document.getElementById('one'),'walden');
var option = {
grid: {
top: 50,
left:40,
right: 20,
},
tooltip: {
trigger: 'axis',
@ -214,7 +250,7 @@ export class echartsComponent implements OnInit {
// x轴
xAxis: {
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月'],
data: X,
boundaryGap: true,
axisLabel: {
color: "#000", //刻度线标签颜色
@ -251,11 +287,10 @@ export class echartsComponent implements OnInit {
name: '单位预案编制数量',
type: 'line',
markPoint: {
symbolSize:[65, 65],
data: this.tiaoshiPao
},
data: [270, 253, 244, 199, 189, 173, 160, 198,200],
data: Y,
}
],
};
@ -263,7 +298,7 @@ export class echartsComponent implements OnInit {
}
twoExample:any;
twoInit () {
twoInit (X=this.datayuex, Y=this.datayuey) {
let that = this
this.twoExample = echarts.init(document.getElementById('two'), 'skinUpp');
var option = {
@ -294,7 +329,7 @@ export class echartsComponent implements OnInit {
// x轴
xAxis: {
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月'],
data: X,
boundaryGap: true,
axisLabel: {
color: "#000", //刻度线标签颜色
@ -335,7 +370,7 @@ export class echartsComponent implements OnInit {
symbolSize:[65, 65],
data: this.tiaoshiPao
},
data: [270, 253, 244, 199, 189, 173, 160, 198,200],
data: Y,
}
],
};
@ -347,7 +382,7 @@ export class echartsComponent implements OnInit {
}
threeExample:any;
threeInit () {
threeInit (X=this.datayuex, Y=this.datayuey) {
let that = this
this.threeExample = echarts.init(document.getElementById('three'), 'skinUpp');
var option = {
@ -377,7 +412,7 @@ export class echartsComponent implements OnInit {
// x轴
xAxis: {
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月'],
data: X,
boundaryGap: true,
axisLabel: {
color: "#000", //刻度线标签颜色
@ -418,7 +453,7 @@ export class echartsComponent implements OnInit {
symbolSize:[65, 65],
data: this.tiaoshiPao
},
data: [270, 253, 244, 199, 189, 173, 160, 198,200],
data: Y,
}
],
};
@ -430,7 +465,7 @@ export class echartsComponent implements OnInit {
}
fourExample:any;
fourInit () {
fourInit (X=this.datayuex, Y=this.datayuey) {
let that = this
this.fourExample = echarts.init(document.getElementById('four'), 'skinUpp');
var option = {
@ -461,7 +496,7 @@ export class echartsComponent implements OnInit {
// x轴
xAxis: {
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月'],
data: X,
boundaryGap: true,
axisLabel: {
color: "#000", //刻度线标签颜色
@ -502,7 +537,7 @@ export class echartsComponent implements OnInit {
symbolSize:[65, 65],
data: this.tiaoshiPao
},
data: [270, 253, 244, 199, 189, 173, 160, 198,200],
data: Y,
}
],
};
@ -514,7 +549,7 @@ export class echartsComponent implements OnInit {
}
fiveExample:any;
fiveInit () {
fiveInit (X=this.datayuex, Y=this.datayuey) {
let that = this
this.fiveExample = echarts.init(document.getElementById('five'), 'skinUpp');
var option = {
@ -546,7 +581,7 @@ export class echartsComponent implements OnInit {
// x轴
xAxis: {
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月'],
data: X,
boundaryGap: true,
axisLabel: {
color: "#000", //刻度线标签颜色
@ -587,7 +622,7 @@ export class echartsComponent implements OnInit {
symbolSize:[65, 65],
data: this.tiaoshiPao
},
data: [270, 253, 244, 199, 189, 173, 160, 198,200],
data: Y,
}
],
};
@ -599,7 +634,7 @@ export class echartsComponent implements OnInit {
}
sixExample:any;
sixInit () {
sixInit (X=this.datayuex, Y=this.datayuey) {
let that = this
this.sixExample = echarts.init(document.getElementById('six'), 'skinUpp');
var option = {
@ -630,7 +665,7 @@ export class echartsComponent implements OnInit {
// x轴
xAxis: {
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月'],
data: X,
boundaryGap: true,
axisLabel: {
color: "#000", //刻度线标签颜色
@ -671,7 +706,7 @@ export class echartsComponent implements OnInit {
symbolSize:[65, 65],
data: this.tiaoshiPao
},
data: [270, 253, 244, 199, 189, 173, 160, 198,200],
data: Y,
}
],
};

Write Preview
Loading…
Cancel
Save