machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Address widget timespans

Browse Source
This commit is contained in:
Mononaut
2024-04-26 17:53:44 +00:00
parent 6eb21ffd24
commit ccb27dbdb9
5 changed files with 43 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
frontend/src/app/components/address-graph/address-graph.component.ts
View File

@@ -9,6 +9,15 @@ import { Router } from '@angular/router';
import { RelativeUrlPipe } from '../../shared/pipes/relative-url/relative-url.pipe';
import { StateService } from '../../services/state.service';
const periodSeconds = {
'1d': (60 * 60 * 24),
'3d': (60 * 60 * 24 * 3),
'1w': (60 * 60 * 24 * 7),
'1m': (60 * 60 * 24 * 30),
'6m': (60 * 60 * 24 * 180),
'1y': (60 * 60 * 24 * 365),
};
@Component({
selector: 'app-address-graph',
templateUrl: './address-graph.component.html',
@@ -27,6 +36,7 @@ export class AddressGraphComponent implements OnChanges {
@Input() address: string;
@Input() isPubkey: boolean = false;
@Input() stats: ChainStats;
@Input() period: '1d' | '3d' | '1w' | '1m' | '6m' | '1y' | 'all' = 'all';
@Input() height: number = 200;
@Input() right: number | string = 10;
@Input() left: number | string = 70;
@@ -84,7 +94,24 @@ export class AddressGraphComponent implements OnChanges {
return [d.time * 1000, balance, d];
}).reverse();
const maxValue = this.data.reduce((acc, d) => Math.max(acc, Math.abs(d[1])), 0);
if (this.period !== 'all') {
const now = Date.now();
const start = now - (periodSeconds[this.period] * 1000);
this.data = this.data.filter(d => d[0] >= start);
this.data.push(
{value: [now, this.stats.funded_txo_sum - this.stats.spent_txo_sum], symbol: 'none', tooltip: { show: false }}
);
// [now, this.stats.funded_txo_sum - this.stats.spent_txo_sum, {
// txid: null,
// height: null,
// value: this.stats.funded_txo_sum - this.stats.spent_txo_sum,
// time: Math.floor(now / 1000),
// }]);
}
const maxValue = this.data.reduce((acc, d) => Math.max(acc, Math.abs(d[1] || d.value[1])), 0);
const minValue = this.data.reduce((acc, d) => Math.min(acc, Math.abs(d[1] || d.value[1])), maxValue);
this.chartOptions = {
color: [
@@ -115,6 +142,9 @@ export class AddressGraphComponent implements OnChanges {
},
borderColor: '#000',
formatter: function (data): string {
if (!data?.length || !data[0]?.data?.[2]?.txid) {
return '';
}
const header = data.length === 1
? `${data[0].data[2].txid.slice(0, 6)}...${data[0].data[2].txid.slice(-6)}`
: `${data.length} transactions`;
@@ -148,13 +178,17 @@ export class AddressGraphComponent implements OnChanges {
axisLabel: {
color: 'rgb(110, 112, 121)',
formatter: (val): string => {
if (maxValue > 1_000_000_000) {
let valSpan = maxValue - (this.period === 'all' ? 0 : minValue);
if (valSpan > 100_000_000_000) {
return `${this.amountShortenerPipe.transform(Math.round(val / 100_000_000), 0)} BTC`;
} else if (maxValue > 100_000_000) {
}
else if (valSpan > 1_000_000_000) {
return `${this.amountShortenerPipe.transform(Math.round(val / 100_000_000), 2)} BTC`;
} else if (valSpan > 100_000_000) {
return `${(val / 100_000_000).toFixed(1)} BTC`;
} else if (maxValue > 10_000_000) {
} else if (valSpan > 10_000_000) {
return `${(val / 100_000_000).toFixed(2)} BTC`;
} else if (maxValue > 1_000_000) {
} else if (valSpan > 1_000_000) {
return `${(val / 100_000_000).toFixed(3)} BTC`;
} else {
return `${this.amountShortenerPipe.transform(val, 0)} sats`;
@@ -164,6 +198,7 @@ export class AddressGraphComponent implements OnChanges {
splitLine: {
show: false,
},
min: this.period === 'all' ? 0 : 'dataMin'
},
],
series: [