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

Merge pull request #2295 from mempool/nymkappa/feature/show-more-mining-pool-pie

Browse Source 
Reduce pool ranking pie chart min slice
This commit is contained in:
wiz 2022-08-13 19:47:13 +09:00 committed by GitHub
commit 80f4a98ea7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
frontend/src/app/components/pool-ranking/pool-ranking.component.ts
View File

@ -12,6 +12,7 @@ import { StateService } from '../../services/state.service';
import { chartColors, poolsColor } from 'src/app/app.constants'; import { chartColors, poolsColor } from 'src/app/app.constants';
import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.pipe'; import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.pipe';
import { download } from 'src/app/shared/graphs.utils'; import { download } from 'src/app/shared/graphs.utils';
import { isMobile } from 'src/app/shared/common.utils';
@Component({ @Component({
selector: 'app-pool-ranking', selector: 'app-pool-ranking',
@ -108,21 +109,23 @@ export class PoolRankingComponent implements OnInit {
return pool; return pool;
} }
isMobile() { generatePoolsChartSerieData(miningStats) {
return (window.innerWidth <= 767.98); let poolShareThreshold = 0.5;
if (isMobile()) {
poolShareThreshold = 2;
} else if (this.widget) {
poolShareThreshold = 1;
} }
generatePoolsChartSerieData(miningStats) {
const poolShareThreshold = this.isMobile() ? 2 : 1; // Do not draw pools which hashrate share is lower than that
const data: object[] = []; const data: object[] = [];
let totalShareOther = 0; let totalShareOther = 0;
let totalBlockOther = 0; let totalBlockOther = 0;
let totalEstimatedHashrateOther = 0; let totalEstimatedHashrateOther = 0;
let edgeDistance: any = '20%'; let edgeDistance: any = '20%';
if (this.isMobile() && this.widget) { if (isMobile() && this.widget) {
edgeDistance = 0; edgeDistance = 0;
} else if (this.isMobile() && !this.widget || this.widget) { } else if (isMobile() && !this.widget || this.widget) {
edgeDistance = 10; edgeDistance = 10;
} }
@ -138,7 +141,7 @@ export class PoolRankingComponent implements OnInit {
color: poolsColor[pool.name.replace(/[^a-zA-Z0-9]/g, '').toLowerCase()], color: poolsColor[pool.name.replace(/[^a-zA-Z0-9]/g, '').toLowerCase()],
}, },
value: pool.share, value: pool.share,
name: pool.name + ((this.isMobile() || this.widget) ? `` : ` (${pool.share}%)`), name: pool.name + ((isMobile() || this.widget) ? `` : ` (${pool.share}%)`),
label: { label: {
overflow: 'none', overflow: 'none',
color: '#b1b1b1', color: '#b1b1b1',
@ -146,7 +149,7 @@ export class PoolRankingComponent implements OnInit {
edgeDistance: edgeDistance, edgeDistance: edgeDistance,
}, },
tooltip: { tooltip: {
show: !this.isMobile() || !this.widget, show: !isMobile() || !this.widget,
backgroundColor: 'rgba(17, 19, 31, 1)', backgroundColor: 'rgba(17, 19, 31, 1)',
borderRadius: 4, borderRadius: 4,
shadowColor: 'rgba(0, 0, 0, 0.5)', shadowColor: 'rgba(0, 0, 0, 0.5)',
@ -176,7 +179,7 @@ export class PoolRankingComponent implements OnInit {
color: 'grey', color: 'grey',
}, },
value: totalShareOther, value: totalShareOther,
name: 'Other' + (this.isMobile() ? `` : ` (${totalShareOther.toFixed(2)}%)`), name: 'Other' + (isMobile() ? `` : ` (${totalShareOther.toFixed(2)}%)`),
label: { label: {
overflow: 'none', overflow: 'none',
color: '#b1b1b1', color: '#b1b1b1',
@ -210,7 +213,7 @@ export class PoolRankingComponent implements OnInit {
prepareChartOptions(miningStats) { prepareChartOptions(miningStats) {
let pieSize = ['20%', '80%']; // Desktop let pieSize = ['20%', '80%']; // Desktop
if (this.isMobile() && !this.widget) { if (isMobile() && !this.widget) {
pieSize = ['15%', '60%']; pieSize = ['15%', '60%'];
} }
@ -226,7 +229,7 @@ export class PoolRankingComponent implements OnInit {
series: [ series: [
{ {
zlevel: 0, zlevel: 0,
minShowLabelAngle: 3.6, minShowLabelAngle: 1.8,
name: 'Mining pool', name: 'Mining pool',
type: 'pie', type: 'pie',
radius: pieSize, radius: pieSize,