Merge pull request #5054 from mempool/mononaut/fix-statistics-graphs

Fix statistics graphs
This commit is contained in:
softsimon 2024-05-10 14:12:34 +07:00 committed by GitHub
commit b8725ab13a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 31 additions and 22 deletions

View file

@ -232,8 +232,10 @@ export class CustomDashboardComponent implements OnInit, OnDestroy, AfterViewIni
this.stateService.live2Chart$
.pipe(
scan((acc, stats) => {
const now = Date.now() / 1000;
const start = now - (2 * 60 * 60);
acc.unshift(stats);
acc = acc.slice(0, 120);
acc = acc.filter(p => p.added >= start);
return acc;
}, (mempoolStats || []))
),

View file

@ -66,7 +66,7 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges, On
if (!this.data) {
return;
}
this.windowPreference = this.windowPreferenceOverride ? this.windowPreferenceOverride : this.storageService.getValue('graphWindowPreference');
this.windowPreference = (this.windowPreferenceOverride ? this.windowPreferenceOverride : this.storageService.getValue('graphWindowPreference')) || '2h';
const windowSize = Math.max(10, Math.floor(this.data.series[0].length / 8));
this.MA = this.calculateMA(this.data.series[0], windowSize);
if (this.outlierCappingEnabled === true) {
@ -216,22 +216,19 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges, On
type: 'line',
},
formatter: (params: any) => {
const axisValueLabel: string = formatterXAxis(this.locale, this.windowPreference, params[0].axisValue);
const bestItem = params.reduce((best, item) => {
return (item.seriesName === 'data' && (!best || best.value[1] < item.value[1])) ? item : best;
}, null);
const axisValueLabel: string = formatterXAxis(this.locale, this.windowPreference, bestItem.axisValue);
const colorSpan = (color: string) => `<span class="indicator" style="background-color: ` + color + `"></span>`;
let itemFormatted = '<div class="title">' + axisValueLabel + '</div>';
params.map((item: any, index: number) => {
//Do no include MA in tooltip legend!
if (item.seriesName !== 'MA') {
if (index < 26) {
itemFormatted += `<div class="item">
<div class="indicator-container">${colorSpan(item.color)}</div>
if (bestItem) {
itemFormatted += `<div class="item">
<div class="indicator-container">${colorSpan(bestItem.color)}</div>
<div class="grow"></div>
<div class="value">${formatNumber(item.value[1], this.locale, '1.0-0')}<span class="symbol">vB/s</span></div>
<div class="value">${formatNumber(bestItem.value[1], this.locale, '1.0-0')}<span class="symbol">vB/s</span></div>
</div>`;
}
}
});
}
return `<div class="tx-wrapper-tooltip-chart ${(this.template === 'advanced') ? 'tx-wrapper-tooltip-chart-advanced' : ''}"
style="width: ${(this.windowPreference === '2h' || this.template === 'widget') ? '125px' : '215px'}">${itemFormatted}</div>`;
}

View file

@ -77,7 +77,7 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
}
this.isWidget = this.template === 'widget';
this.showCount = !this.isWidget && !this.hideCount;
this.windowPreference = this.windowPreferenceOverride ? this.windowPreferenceOverride : this.storageService.getValue('graphWindowPreference');
this.windowPreference = (this.windowPreferenceOverride ? this.windowPreferenceOverride : this.storageService.getValue('graphWindowPreference')) || '2h';
this.mempoolVsizeFeesData = this.handleNewMempoolData(this.data.concat([]));
this.mountFeeChart();
}
@ -256,11 +256,17 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
const itemFormatted = [];
let sum = 0;
let progressPercentageText = '';
let countItem;
let items = this.inverted ? [...params].reverse() : params;
if (items[items.length - 1].seriesName === 'count') {
countItem = items.pop();
}
const unfilteredItems = this.inverted ? [...params].reverse() : params;
const countItem = unfilteredItems.find(p => p.seriesName === 'count');
const usedSeries = {};
const items = unfilteredItems.filter(p => {
if (usedSeries[p.seriesName] || p.seriesName === 'count') {
return false;
}
usedSeries[p.seriesName] = true;
return true;
});
items.map((item: any, index: number) => {
sum += item.value[1];
const progressPercentage = (item.value[1] / totalValue) * 100;

View file

@ -71,7 +71,9 @@ export class TelevisionComponent implements OnInit, OnDestroy {
mempoolStats = newStats;
} else if (['2h', '24h'].includes(this.fragment)) {
mempoolStats.unshift(newStats[0]);
mempoolStats = mempoolStats.slice(0, mempoolStats.length - 1);
const now = Date.now() / 1000;
const start = now - (this.fragment === '2h' ? (2 * 60 * 60) : (24 * 60 * 60) );
mempoolStats = mempoolStats.filter(p => p.added >= start);
}
return mempoolStats;
})

View file

@ -231,8 +231,10 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewInit {
this.stateService.live2Chart$
.pipe(
scan((acc, stats) => {
const now = Date.now() / 1000;
const start = now - (2 * 60 * 60);
acc.unshift(stats);
acc = acc.slice(0, 120);
acc = acc.filter(p => p.added >= start);
return acc;
}, (mempoolStats || []))
),