diff --git a/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.ts b/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.ts
index bc3c642db..7ad147b28 100644
--- a/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.ts
+++ b/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.ts
@@ -90,6 +90,7 @@ export class BlockSizesWeightsGraphComponent implements OnInit {
this.prepareChartOptions({
sizes: data.sizes.map(val => [val.timestamp * 1000, val.avgSize / 1000000, val.avgHeight]),
weights: data.weights.map(val => [val.timestamp * 1000, val.avgWeight / 1000000, val.avgHeight]),
+ sizePerWeight: data.weights.map((val, i) => [val.timestamp * 1000, data.sizes[i].avgSize / (val.avgWeight / 4), val.avgHeight]),
});
this.isLoading = false;
}),
@@ -124,6 +125,7 @@ export class BlockSizesWeightsGraphComponent implements OnInit {
color: [
'#FDD835',
'#D81B60',
+ '#14EDF5',
],
grid: {
top: 30,
@@ -153,6 +155,8 @@ export class BlockSizesWeightsGraphComponent implements OnInit {
tooltip += `${tick.marker} ${tick.seriesName}: ${formatNumber(tick.data[1], this.locale, '1.2-2')} MB`;
} else if (tick.seriesIndex === 1) { // Weight
tooltip += `${tick.marker} ${tick.seriesName}: ${formatNumber(tick.data[1], this.locale, '1.2-2')} MWU`;
+ } else if (tick.seriesIndex === 2) { // Size per weight
+ tooltip += `${tick.marker} ${tick.seriesName}: ${formatNumber(tick.data[1], this.locale, '1.2-2')} B/vB`;
}
tooltip += `
`;
}
@@ -192,10 +196,19 @@ export class BlockSizesWeightsGraphComponent implements OnInit {
},
icon: 'roundRect',
},
+ {
+ name: $localize`Size per weight`,
+ inactiveColor: 'rgb(110, 112, 121)',
+ textStyle: {
+ color: 'white',
+ },
+ icon: 'roundRect',
+ },
],
selected: JSON.parse(this.storageService.getValue('sizes_weights_legend')) ?? {
'Size': true,
'Weight': true,
+ 'Size per weight': true,
}
},
yAxis: data.sizes.length === 0 ? undefined : [
@@ -262,6 +275,18 @@ export class BlockSizesWeightsGraphComponent implements OnInit {
lineStyle: {
width: 2,
}
+ },
+ {
+ zlevel: 1,
+ yAxisIndex: 0,
+ name: $localize`Size per weight`,
+ showSymbol: false,
+ symbol: 'none',
+ data: data.sizePerWeight,
+ type: 'line',
+ lineStyle: {
+ width: 2,
+ }
}
],
dataZoom: [{
diff --git a/frontend/src/app/interfaces/node-api.interface.ts b/frontend/src/app/interfaces/node-api.interface.ts
index c35eb8098..c11cb5828 100644
--- a/frontend/src/app/interfaces/node-api.interface.ts
+++ b/frontend/src/app/interfaces/node-api.interface.ts
@@ -151,6 +151,19 @@ export interface RewardStats {
totalTx: number;
}
+export interface BlockSizesAndWeights {
+ sizes: {
+ timestamp: number;
+ avgHeight: number;
+ avgSize: number;
+ }[];
+ weights: {
+ timestamp: number;
+ avgHeight: number;
+ avgWeight: number;
+ }[];
+}
+
export interface AuditScore {
hash: string;
matchRate?: number;
diff --git a/frontend/src/app/services/api.service.ts b/frontend/src/app/services/api.service.ts
index 6eff41f61..04b2b72e2 100644
--- a/frontend/src/app/services/api.service.ts
+++ b/frontend/src/app/services/api.service.ts
@@ -1,7 +1,7 @@
import { Injectable } from '@angular/core';
-import { HttpClient, HttpParams } from '@angular/common/http';
+import { HttpClient, HttpParams, HttpResponse } from '@angular/common/http';
import { CpfpInfo, OptimizedMempoolStats, AddressInformation, LiquidPegs, ITranslators,
- PoolStat, BlockExtended, TransactionStripped, RewardStats, AuditScore } from '../interfaces/node-api.interface';
+ PoolStat, BlockExtended, TransactionStripped, RewardStats, AuditScore, BlockSizesAndWeights } from '../interfaces/node-api.interface';
import { Observable } from 'rxjs';
import { StateService } from './state.service';
import { WebsocketResponse } from '../interfaces/websocket.interface';
@@ -222,8 +222,8 @@ export class ApiService {
);
}
- getHistoricalBlockSizesAndWeights$(interval: string | undefined) : Observable {
- return this.httpClient.get(
+ getHistoricalBlockSizesAndWeights$(interval: string | undefined) : Observable> {
+ return this.httpClient.get(
this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/blocks/sizes-weights` +
(interval !== undefined ? `/${interval}` : ''), { observe: 'response' }
);