102 lines
5.3 KiB
HTML
102 lines
5.3 KiB
HTML
<div class="container-graph">
|
|
<div>
|
|
<div>
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<i class="fa fa-area-chart"></i>
|
|
<span i18n="statistics.memory-by-vBytes">Mempool by vBytes (sat/vByte)</span>
|
|
<button class="btn" style="margin: 0 0 4px 0px" (click)="onSaveChart('mempool')">
|
|
<fa-icon [icon]="['fas', 'download']" [fixedWidth]="true"></fa-icon>
|
|
</button>
|
|
|
|
<form [formGroup]="radioGroupForm" class="formRadioGroup" (click)="saveGraphPreference()">
|
|
<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'2h'" [routerLink]="['/graphs' | relativeUrl]" fragment="2h"> 2H
|
|
(LIVE)
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'24h'" [routerLink]="['/graphs' | relativeUrl]" fragment="24h">
|
|
24H
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'1w'" [routerLink]="['/graphs' | relativeUrl]" fragment="1w"> 1W
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'1m'" [routerLink]="['/graphs' | relativeUrl]" fragment="1m"> 1M
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'3m'" [routerLink]="['/graphs' | relativeUrl]" fragment="3m"> 3M
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'6m'" [routerLink]="['/graphs' | relativeUrl]" fragment="6m"> 6M
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'1y'" [routerLink]="['/graphs' | relativeUrl]" fragment="1y"> 1Y
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'2y'" [routerLink]="['/graphs' | relativeUrl]" fragment="2y"> 2Y
|
|
</label>
|
|
<label ngbButtonLabel class="btn-primary btn-sm">
|
|
<input ngbButton type="radio" [value]="'3y'" [routerLink]="['/graphs' | relativeUrl]" fragment="3y"> 3Y
|
|
</label>
|
|
</div>
|
|
<div class="small-buttons">
|
|
<div ngbDropdown #myDrop="ngbDropdown">
|
|
<button class="btn btn-primary btn-sm" id="dropdownFees" ngbDropdownAnchor (click)="myDrop.toggle()">
|
|
<fa-icon [icon]="['fas', 'filter']" [fixedWidth]="true" i18n-title="statistics.component-filter.title"
|
|
title="Filter"></fa-icon>
|
|
</button>
|
|
<div class="dropdown-fees" ngbDropdownMenu aria-labelledby="dropdownFees">
|
|
<ul>
|
|
<ng-template ngFor let-feeData let-i="index" [ngForOf]="feeLevelDropdownData">
|
|
<ng-template [ngIf]="feeData.fee <= 400">
|
|
<li (click)="filterFeeIndex = feeData.fee"
|
|
[class]="filterFeeIndex > feeData.fee ? 'inactive' : ''">
|
|
<span class="square" [ngStyle]="{'backgroundColor': feeData.color}"></span>
|
|
<span class="fee-text">{{ feeData.range }}</span>
|
|
</li>
|
|
</ng-template>
|
|
</ng-template>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<button (click)="invertGraph()" class="btn btn-primary btn-sm">
|
|
<fa-icon [icon]="['fas', 'exchange-alt']" [rotate]="90" [fixedWidth]="true"
|
|
i18n-title="statistics.component-invert.title" title="Invert"></fa-icon>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
<div class="spinner-border text-light bootstrap-spinner" *ngIf="spinnerLoading && mempoolStats.length"></div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="incoming-transactions-graph">
|
|
<app-mempool-graph #mempoolgraph dir="ltr" [template]="'advanced'" [limitFee]="500"
|
|
[limitFilterFee]="filterFeeIndex" [height]="500" [left]="65" [right]="10"
|
|
[data]="mempoolStats && mempoolStats.length ? mempoolStats : null"></app-mempool-graph>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<i class="fa fa-area-chart"></i>
|
|
<span i18n="statistics.transaction-vbytes-per-second">Transaction vBytes per second (vB/s)</span>
|
|
<button class="btn" style="margin: 0 0 4px 0px" (click)="onSaveChart('incoming')">
|
|
<fa-icon [icon]="['fas', 'download']" [fixedWidth]="true"></fa-icon>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<div class="incoming-transactions-graph">
|
|
<app-incoming-transactions-graph #incominggraph [height]="500" [left]="65" [template]="'advanced'"
|
|
[data]="mempoolTransactionsWeightPerSecondData"></app-incoming-transactions-graph>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |