mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2024-11-20 02:11:49 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #4822 from mempool/natsoni/add-pool-dominance-to-graph

Browse Source 
Add pool dominance data to mining pool page
This commit is contained in:
softsimon 2024-03-26 17:01:40 +09:00 committed by GitHub
commit 1ea66595ea
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 75 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/app/components/pool/pool.component.scss
View File

@ -32,6 +32,7 @@
}
.chart {
margin-top: 10px;
margin-bottom: 20px;
@media (max-width: 768px) {
margin-bottom: 10px;

91
frontend/src/app/components/pool/pool.component.ts
View File

@ -65,7 +65,9 @@ export class PoolComponent implements OnInit {
.pipe(
switchMap((data) => {
this.isLoading = false;
this.prepareChartOptions(data.map(val => [val.timestamp * 1000, val.avgHashrate]));
const hashrate = data.map(val => [val.timestamp * 1000, val.avgHashrate]);
const share = data.map(val => [val.timestamp * 1000, val.share * 100]);
this.prepareChartOptions(hashrate, share);
return [slug];
}),
catchError(() => {
@ -130,9 +132,9 @@ export class PoolComponent implements OnInit {
);
}
prepareChartOptions(data) {
prepareChartOptions(hashrate, share) {
let title: object;
if (data.length <= 1) {
if (hashrate.length <= 1) {
title = {
textStyle: {
color: 'grey',
@ -177,26 +179,57 @@ export class PoolComponent implements OnInit {
},
borderColor: '#000',
formatter: function (ticks: any[]) {
let hashratePowerOfTen: any = selectPowerOfTen(1);
let hashrate = ticks[0].data[1];
hashratePowerOfTen = selectPowerOfTen(ticks[0].data[1], 10);
hashrate = ticks[0].data[1] / hashratePowerOfTen.divider;
let hashrateString = '';
let dominanceString = '';
for (const tick of ticks) {
if (tick.seriesIndex === 0) {
let hashratePowerOfTen = selectPowerOfTen(tick.data[1], 10);
let hashrateData = tick.data[1] / hashratePowerOfTen.divider;
hashrateString = `${tick.marker} ${tick.seriesName}: ${formatNumber(hashrateData, this.locale, '1.0-0')} ${hashratePowerOfTen.unit}H/s<br>`;
} else if (tick.seriesIndex === 1) {
dominanceString = `${tick.marker} ${tick.seriesName}: ${formatNumber(tick.data[1], this.locale, '1.0-2')}%`;
}
}
return `
<b style="color: white; margin-left: 18px">${ticks[0].axisValueLabel}</b><br>
<span>${ticks[0].marker} ${ticks[0].seriesName}: ${formatNumber(hashrate, this.locale, '1.0-0')} ${hashratePowerOfTen.unit}H/s</span><br>
<span>${hashrateString}</span>
<span>${dominanceString}</span>
`;
}.bind(this)
},
xAxis: data.length <= 1 ? undefined : {
xAxis: hashrate.length <= 1 ? undefined : {
type: 'time',
splitNumber: (this.isMobile()) ? 5 : 10,
axisLabel: {
hideOverlap: true,
}
},
yAxis: data.length <= 1 ? undefined : [
legend: {
data: [
{
name: $localize`:mining.hashrate:Hashrate`,
inactiveColor: 'rgb(110, 112, 121)',
textStyle: {
color: 'white',
},
icon: 'roundRect',
itemStyle: {
color: '#FFB300',
},
},
{
name: $localize`:mining.pool-dominance:Pool Dominance`,
inactiveColor: 'rgb(110, 112, 121)',
textStyle: {
color: 'white',
},
icon: 'roundRect',
},
],
},
yAxis: hashrate.length <= 1 ? undefined : [
{
min: (value) => {
return value.min * 0.9;
@ -214,21 +247,45 @@ export class PoolComponent implements OnInit {
show: false,
}
},
],
series: data.length <= 1 ? undefined : [
{
zlevel: 0,
name: 'Hashrate',
type: 'value',
axisLabel: {
color: 'rgb(110, 112, 121)',
formatter: (val) => {
return `${val}%`
}
},
splitLine: {
show: false,
}
}
],
series: hashrate.length <= 1 ? undefined : [
{
zlevel: 1,
name: $localize`:mining.hashrate:Hashrate`,
showSymbol: false,
symbol: 'none',
data: data,
data: hashrate,
type: 'line',
lineStyle: {
width: 2,
},
},
{
zlevel: 0,
name: $localize`:mining.pool-dominance:Pool Dominance`,
showSymbol: false,
symbol: 'none',
data: share,
type: 'line',
yAxisIndex: 1,
lineStyle: {
width: 2,
},
}
],
dataZoom: data.length <= 1 ? undefined : [{
dataZoom: hashrate.length <= 1 ? undefined : [{
type: 'inside',
realtime: true,
zoomLock: true,