diff --git a/src/app/routes/datatable/components/datascreen/curve/map.component.html b/src/app/routes/datatable/components/datascreen/curve/map.component.html index 0640a4d4..4bdcc4de 100644 --- a/src/app/routes/datatable/components/datascreen/curve/map.component.html +++ b/src/app/routes/datatable/components/datascreen/curve/map.component.html @@ -1 +1,11 @@ - \ No newline at end of file + + \ No newline at end of file diff --git a/src/app/routes/datatable/components/datascreen/curve/map.component.ts b/src/app/routes/datatable/components/datascreen/curve/map.component.ts index 5ce91326..9775b4a1 100644 --- a/src/app/routes/datatable/components/datascreen/curve/map.component.ts +++ b/src/app/routes/datatable/components/datascreen/curve/map.component.ts @@ -20,11 +20,7 @@ export class DatatableCustomindexMapComponent implements OnInit, OnChanges { constructor(private service: DataService, private ngZone: NgZone) {} ngOnChanges(changes: SimpleChanges): void { - if (changes.chartData && !changes.chartData.isFirstChange()) { - this.userData = changes.chartData.currentValue; - console.log(this.userView); - - this.userView.source(this.userData) + if (this.chartData) { // setTimeout(()=>{ // this.chart.render(true) // }, 1000) @@ -91,21 +87,17 @@ export class DatatableCustomindexMapComponent implements OnInit, OnChanges { }); // 可视化用户数据 - this.userData = this.chartData - console.log(this.userData); - - // let value: any = [] - // this.service.request(this.service.$api_getTransactionDistribution).subscribe((res: any) => { - // if(res) { - // res.forEach((element: any) => { - // value.push({ - // name: element.province, - // value: element.weight, - // }); - // }); - // console.log(value); - // this.userData = value - this.userDv = this.ds.createView().source(this.userData).transform({ + this.userData = [ + { name: '山东', value: 21 }, + { name: '山东', value: 22}, + { name: '广东', value: 20, }, + { name: '广东', value: 20 }, + { name: '四川', value: 120 }, + { name: '湖南', value: 200 }, + { name: '河北', value: 30 }, + + ]; + this.userDv = this.ds.createView().source(this.userData).transform({ geoDataView: this.worldMap, field: 'name', type: 'geo.region', @@ -113,7 +105,6 @@ export class DatatableCustomindexMapComponent implements OnInit, OnChanges { }).transform({ type: 'map', callback: (obj: { trend: string; value: number }) => { - console.log(this.userData); obj.trend = obj.value > 100 ? '蓝色地区' : '红色地区'; return obj; @@ -126,6 +117,9 @@ export class DatatableCustomindexMapComponent implements OnInit, OnChanges { // alias: '蓝色地区数量' // } // }); + console.log(this.userView); + console.log('45545'); + this.userView.polygon().position('longitude*latitude').color('trend', ['#000', '#76ddb2']).tooltip('').style({fillOpacity: 0.85 }) // .animate({ // leave: { @@ -134,10 +128,13 @@ export class DatatableCustomindexMapComponent implements OnInit, OnChanges { // }); this.userView.interaction('element-active'); this.chart.render(); - // } - // }); - }) + + }); + + console.log('9999'); + + } } diff --git a/src/app/routes/datatable/components/datascreen/datascreen.component.html b/src/app/routes/datatable/components/datascreen/datascreen.component.html index 0c3e37dc..939d29dd 100644 --- a/src/app/routes/datatable/components/datascreen/datascreen.component.html +++ b/src/app/routes/datatable/components/datascreen/datascreen.component.html @@ -4,14 +4,15 @@ * @Author : Shiming * @Date : 2022-04-06 10:57:56 * @LastEditors : Shiming - * @LastEditTime : 2022-04-07 14:59:07 + * @LastEditTime : 2022-04-07 16:16:57 * @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\datascreen.component.html * Copyright (C) 2022 huzhenhong. All rights reserved. --> -
-

运多星网络货运平台实时交易监控

+
+

运多星网络货运平台

+

实时交易监控

@@ -34,10 +35,12 @@ - @@ -86,7 +89,7 @@ - +
diff --git a/src/app/routes/datatable/components/datascreen/datascreen.component.ts b/src/app/routes/datatable/components/datascreen/datascreen.component.ts index 0c72e06f..a0ff7310 100644 --- a/src/app/routes/datatable/components/datascreen/datascreen.component.ts +++ b/src/app/routes/datatable/components/datascreen/datascreen.component.ts @@ -5,7 +5,7 @@ import { map } from 'rxjs/operators'; * @Author : Shiming * @Date : 2022-04-06 10:57:56 * @LastEditors : Shiming - * @LastEditTime : 2022-04-07 15:16:53 + * @LastEditTime : 2022-04-07 15:53:41 * @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\datascreen.component.ts * Copyright (C) 2022 huzhenhong. All rights reserved. */ @@ -15,7 +15,7 @@ import { SFSchema } from '@delon/form'; import { ModalHelper, _HttpClient } from '@delon/theme'; import { DataService } from '../../services/data.service'; import { DatatableCustomindexMapComponent } from './curve/map.component'; -import { G2TimelineData } from '@delon/chart/timeline'; +import { G2TimelineComponent, G2TimelineData } from '@delon/chart/timeline'; import { G2MiniAreaClickItem, G2MiniAreaData } from '@delon/chart/mini-area'; import { format } from 'date-fns'; @@ -29,6 +29,8 @@ export class DatatableDatascreenComponent implements OnInit { @ViewChild('st') private readonly st!: STComponent; @ViewChild('orderSt') private readonly orderSt!: STComponent; @ViewChild('map') private readonly map!: DatatableCustomindexMapComponent; + @ViewChild('timeline', { static: false }) timeline!: G2TimelineComponent; + columns: STColumn[] = []; chartData: any[] = []; orderColumns: STColumn[] = []; @@ -39,11 +41,14 @@ export class DatatableDatascreenComponent implements OnInit { monthData: G2TimelineData[] = []; salesData :any; - salesData2 :any = this.genData(); + salesData2 :Array = this.genData(); constructor(public service: DataService) { } - + ngOnChanges(changes: any): void { + console.log(changes); + + } /** * 查询参数 */ @@ -95,16 +100,12 @@ export class DatatableDatascreenComponent implements OnInit { initLineData(){ this.service.request(this.service.$api_getTradingTrend).subscribe((res: any) => { this.monthData = res - // for (let i = 0; i < 20; i += 1) { - // this.monthData.push({ - // time: new Date().getTime() + 1000 * 60 * 60 * 24 * i, - // y1: Math.floor(Math.random() * 100) + 1000, - // y2: Math.floor(Math.random() * 100) + 10, - // }); - // } - }) - this.service.request(this.service.$api_getTradingTrend).subscribe((res: any) => { - this.monthData = res + if (this.timeline) { + console.log(this.timeline); + + // 等待组件渲染 + setTimeout(() => this.timeline.changeData()); + } // for (let i = 0; i < 20; i += 1) { // this.monthData.push({ // time: new Date().getTime() + 1000 * 60 * 60 * 24 * i, @@ -123,6 +124,13 @@ export class DatatableDatascreenComponent implements OnInit { }); }); this.salesData = value + // if (this.pie) { + // // 等待组件渲染 + // setTimeout(() => { + // console.log('a') + // this.pie.changeData() + // }); + // } console.log(this.salesData); }) }