解决冲突

This commit is contained in:
wangshiming
2022-04-07 16:17:34 +08:00
parent 77e5044a63
commit a959b4708b
4 changed files with 62 additions and 44 deletions

View File

@ -1 +1,11 @@
<g2-custom delay="100" (render)="render($event)"></g2-custom>
<!--
* @Description :
* @Version : 1.0
* @Author : Shiming
* @Date : 2022-04-06 17:57:07
* @LastEditors : Shiming
* @LastEditTime : 2022-04-07 15:48:36
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\curve\\map.component.html
* Copyright (C) 2022 huzhenhong. All rights reserved.
-->
<g2-custom delay="200" (render)="render($event)"></g2-custom>

View File

@ -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');
}
}

View File

@ -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.
-->
<!-- 页头 -->
<!-- <page-header-wrapper [title]="'运营报表'"></page-header-wrapper> -->
<div style="display: flex; justify-content: center; align-items: center">
<h1>运多星网络货运平台实时交易监控</h1>
<div >
<h1 style="display: flex; justify-content: center; align-items: center;margin: 0; padding: 0; font-size: 25px;font-weight: 700;">运多星网络货运平台</h1>
<h1 style="display: flex; justify-content: center; align-items: center;margin: 0; padding: 0;font-size: 25px;font-weight: 700;">实时交易监控</h1>
</div>
<div nz-row [nzGutter]="24">
<div nz-col class="gutter-row" [nzSpan]="8">
@ -34,10 +35,12 @@
</nz-row>
</nz-card>
<nz-card nzTitle="本月交易趋势">
<g2-timeline
<g2-timeline repaint='true'
[data]="monthData"
#timeline
[titleMap]="{ y1: '订单数', y2: '运单数' }"
[height]="200"
[delay]='500'
mask="MM月DD日"
[slider]="false"
></g2-timeline>
@ -86,7 +89,7 @@
<app-datatable-customindex-map style="max-height: 600px" #map [chartData]="chartData"></app-datatable-customindex-map>
<nz-card>
<nz-row [nzGutter]="24">
<g2-bar height="200" [title]="'本月发货量排名'" [data]="salesData2" (ready)='genData()'></g2-bar>
<g2-bar #bar height="200" [delay]='500' repaint='true' [title]="'本月发货量排名'" [data]="salesData2" (ready)='genData()'></g2-bar>
</nz-row>
</nz-card>
</div>

View File

@ -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<any> = 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);
})
}