Add player count statistic
parent
85b192ad39
commit
9070964adb
|
@ -1,48 +1,5 @@
|
||||||
h1 {
|
h3 {
|
||||||
width: 920px;
|
width: 920px;
|
||||||
margin-bottom: 50px;
|
margin-bottom: 50px;
|
||||||
margin-left: 25%
|
margin-left: 25%
|
||||||
}
|
}
|
||||||
|
|
||||||
img {
|
|
||||||
margin-top: 10px;
|
|
||||||
padding-right: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.div-table {
|
|
||||||
display: table;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin-left: 1%;
|
|
||||||
width: auto;
|
|
||||||
border-spacing: 5px; /* cellspacing:poor IE support for this */
|
|
||||||
}
|
|
||||||
|
|
||||||
.div-table-row {
|
|
||||||
display: table-row;
|
|
||||||
width: auto;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.div-table-col {
|
|
||||||
float: left; /* fix for buggy browsers */
|
|
||||||
display: table-column;
|
|
||||||
padding: 5px 15px 5px 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.army-head {
|
|
||||||
font-weight: bolder;
|
|
||||||
text-align: center
|
|
||||||
}
|
|
||||||
|
|
||||||
.member-link {
|
|
||||||
cursor: pointer;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-opfor {
|
|
||||||
color: firebrick;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-blufor {
|
|
||||||
color: blue;
|
|
||||||
}
|
|
||||||
|
|
|
@ -13,10 +13,9 @@
|
||||||
[legendTitle]="''"
|
[legendTitle]="''"
|
||||||
[showXAxisLabel]="true"
|
[showXAxisLabel]="true"
|
||||||
[showYAxisLabel]="true"
|
[showYAxisLabel]="true"
|
||||||
[xAxisLabel]="Schlachtdatum"
|
[xAxisLabel]="'Schlachtdatum'"
|
||||||
[yAxisLabel]="Punkte"
|
[yAxisLabel]="'Punkte'"
|
||||||
[autoScale]="false"
|
[autoScale]="false"
|
||||||
[timeline]="true"
|
|
||||||
(select)="onSelect($event)">
|
(select)="onSelect($event)">
|
||||||
</ngx-charts-line-chart>
|
</ngx-charts-line-chart>
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import {Component} from "@angular/core";
|
import {Component} from "@angular/core";
|
||||||
|
import {AppComponent} from "../app.component";
|
||||||
import {WarService} from "../services/war-service/war.service";
|
import {WarService} from "../services/war-service/war.service";
|
||||||
|
|
||||||
|
|
||||||
|
@ -12,40 +13,70 @@ export class StatisticComponent {
|
||||||
chartData: any[] = [];
|
chartData: any[] = [];
|
||||||
|
|
||||||
colorScheme = {
|
colorScheme = {
|
||||||
domain: ['#0000FF', '#B22222', '#C7B42C', '#AAAAAA']
|
domain: ['#0000FF', '#B22222', '#595DC7', '#B25D62']
|
||||||
};
|
};
|
||||||
|
|
||||||
constructor(private warService: WarService) {
|
constructor(private appComponent: AppComponent,
|
||||||
Object.assign(this, this.chartData)
|
private warService: WarService) {
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.warService.getAllWars()
|
let wars = this.appComponent.wars;
|
||||||
.subscribe((wars) => {
|
if (wars.length === 0) {
|
||||||
let updateObj = [{
|
this.warService.getAllWars().subscribe(items => {
|
||||||
"name": "NATO",
|
this.initChart(items);
|
||||||
"series": []
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "CSAT",
|
|
||||||
"series": []
|
|
||||||
}];
|
|
||||||
for (let i = 0; i < wars.length; i++) {
|
|
||||||
let warDateString = new Date(wars[i].date);
|
|
||||||
let bluforData = {
|
|
||||||
name: warDateString,
|
|
||||||
value: wars[i].ptBlufor
|
|
||||||
};
|
|
||||||
updateObj[0].series.push(bluforData);
|
|
||||||
let opforData = {
|
|
||||||
name: warDateString,
|
|
||||||
value: wars[i].ptOpfor
|
|
||||||
};
|
|
||||||
updateObj[1].series.push(opforData);
|
|
||||||
}
|
|
||||||
this.chartData = updateObj;
|
|
||||||
})
|
})
|
||||||
};
|
}
|
||||||
|
this.initChart(wars);
|
||||||
|
}
|
||||||
|
|
||||||
|
initChart(wars: any[]) {
|
||||||
|
let updateObj = [
|
||||||
|
{
|
||||||
|
"name": "NATO",
|
||||||
|
"series": []
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "CSAT",
|
||||||
|
"series": []
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Anz. Spieler NATO",
|
||||||
|
"series": []
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Anz. Spieler CSAT",
|
||||||
|
"series": []
|
||||||
|
}];
|
||||||
|
for (let i = wars.length - 1; i >= 0; i--) {
|
||||||
|
let isoDate = wars[i].date.slice(0, 10);
|
||||||
|
let dayDate = parseInt(isoDate.slice(8, 10)) + 1;
|
||||||
|
let warDateString = (dayDate < 10 ? "0" + dayDate : dayDate) + '.'
|
||||||
|
+ isoDate.slice(5, 7) + '.' + isoDate.slice(0, 4);
|
||||||
|
let bluforData = {
|
||||||
|
name: warDateString,
|
||||||
|
value: wars[i].ptBlufor
|
||||||
|
};
|
||||||
|
updateObj[0].series.push(bluforData);
|
||||||
|
let opforData = {
|
||||||
|
name: warDateString,
|
||||||
|
value: wars[i].ptOpfor
|
||||||
|
};
|
||||||
|
updateObj[1].series.push(opforData);
|
||||||
|
let bluforPlayers = {
|
||||||
|
name: warDateString,
|
||||||
|
value: 13
|
||||||
|
};
|
||||||
|
updateObj[2].series.push(bluforPlayers);
|
||||||
|
let opforPlayers = {
|
||||||
|
name: warDateString,
|
||||||
|
value: 13
|
||||||
|
};
|
||||||
|
updateObj[3].series.push(opforPlayers);
|
||||||
|
}
|
||||||
|
this.chartData = updateObj;
|
||||||
|
Object.assign(this, this.chartData)
|
||||||
|
}
|
||||||
|
|
||||||
onSelect(event) {
|
onSelect(event) {
|
||||||
console.log(event);
|
console.log(event);
|
||||||
|
|
Loading…
Reference in New Issue