Add Lightning charts in /graph
This commit is contained in:
@@ -8,35 +8,26 @@
|
||||
|
||||
<form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(nodesNetworkObservable$ | async) as stats">
|
||||
<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 144">
|
||||
<input ngbButton type="radio" [value]="'24h'" fragment="24h" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 24h
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.days >= 30">
|
||||
<input ngbButton type="radio" [value]="'1m'" fragment="1m" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"> 1M
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 432">
|
||||
<input ngbButton type="radio" [value]="'3d'" fragment="3d" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 3D
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.days >= 90">
|
||||
<input ngbButton type="radio" [value]="'3m'" fragment="3m" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"> 3M
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 1008">
|
||||
<input ngbButton type="radio" [value]="'1w'" fragment="1w" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 1W
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.days >= 180">
|
||||
<input ngbButton type="radio" [value]="'6m'" fragment="6m" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"> 6M
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 4320">
|
||||
<input ngbButton type="radio" [value]="'1m'" fragment="1m" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 1M
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.days >= 365">
|
||||
<input ngbButton type="radio" [value]="'1y'" fragment="1y" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"> 1Y
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 12960">
|
||||
<input ngbButton type="radio" [value]="'3m'" fragment="3m" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 3M
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.days >= 730">
|
||||
<input ngbButton type="radio" [value]="'2y'" fragment="2y" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"> 2Y
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 25920">
|
||||
<input ngbButton type="radio" [value]="'6m'" fragment="6m" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 6M
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.days >= 1095">
|
||||
<input ngbButton type="radio" [value]="'3y'" fragment="3y" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"> 3Y
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 52560">
|
||||
<input ngbButton type="radio" [value]="'1y'" fragment="1y" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 1Y
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 105120">
|
||||
<input ngbButton type="radio" [value]="'2y'" fragment="2y" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 2Y
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 157680">
|
||||
<input ngbButton type="radio" [value]="'3y'" fragment="3y" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> 3Y
|
||||
</label>
|
||||
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount > 157680">
|
||||
<input ngbButton type="radio" [value]="'all'" fragment="all" [routerLink]="['/graphs/mining/block-sizes-weights' | relativeUrl]"> ALL
|
||||
<label ngbButtonLabel class="btn-primary btn-sm">
|
||||
<input ngbButton type="radio" [value]="'all'" fragment="all" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"> ALL
|
||||
</label>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||
import { EChartsOption} from 'echarts';
|
||||
import { Observable } from 'rxjs';
|
||||
import { startWith, switchMap, tap } from 'rxjs/operators';
|
||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||
import { formatNumber } from '@angular/common';
|
||||
import { FormBuilder, FormGroup } from '@angular/forms';
|
||||
import { StorageService } from 'src/app/services/storage.service';
|
||||
import { MiningService } from 'src/app/services/mining.service';
|
||||
import { download, formatterXAxis } from 'src/app/shared/graphs.utils';
|
||||
import { download } from 'src/app/shared/graphs.utils';
|
||||
import { SeoService } from 'src/app/services/seo.service';
|
||||
import { LightningApiService } from '../lightning-api.service';
|
||||
|
||||
@@ -62,7 +62,7 @@ export class NodesNetworksChartComponent implements OnInit {
|
||||
this.miningWindowPreference = '1y';
|
||||
} else {
|
||||
this.seoService.setTitle($localize`Nodes per network`);
|
||||
this.miningWindowPreference = this.miningService.getDefaultTimespan('1m');
|
||||
this.miningWindowPreference = this.miningService.getDefaultTimespan('all');
|
||||
}
|
||||
this.radioGroupForm = this.formBuilder.group({ dateSpan: this.miningWindowPreference });
|
||||
this.radioGroupForm.controls.dateSpan.setValue(this.miningWindowPreference);
|
||||
@@ -73,14 +73,15 @@ export class NodesNetworksChartComponent implements OnInit {
|
||||
switchMap((timespan) => {
|
||||
this.timespan = timespan;
|
||||
if (!this.widget && !firstRun) {
|
||||
this.storageService.setValue('miningWindowPreference', timespan);
|
||||
this.storageService.setValue('lightningWindowPreference', timespan);
|
||||
}
|
||||
firstRun = false;
|
||||
this.miningWindowPreference = timespan;
|
||||
this.isLoading = true;
|
||||
return this.lightningApiService.listStatistics$()
|
||||
return this.lightningApiService.listStatistics$(timespan)
|
||||
.pipe(
|
||||
tap((data) => {
|
||||
tap((response) => {
|
||||
const data = response.body;
|
||||
this.prepareChartOptions({
|
||||
node_count: data.map(val => [val.added * 1000, val.node_count]),
|
||||
tor_nodes: data.map(val => [val.added * 1000, val.tor_nodes]),
|
||||
@@ -89,9 +90,15 @@ export class NodesNetworksChartComponent implements OnInit {
|
||||
});
|
||||
this.isLoading = false;
|
||||
}),
|
||||
map((response) => {
|
||||
return {
|
||||
days: parseInt(response.headers.get('x-total-count'), 10),
|
||||
};
|
||||
}),
|
||||
);
|
||||
}),
|
||||
)
|
||||
share()
|
||||
);
|
||||
}
|
||||
|
||||
prepareChartOptions(data) {
|
||||
|
||||
Reference in New Issue
Block a user