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

Merge pull request #2110 from mempool/nymkappa/bugfix/block-prediction-chart-no-data

Browse Source 
Fix block prediction chart when there is few or no data available
This commit is contained in:
wiz 2022-07-17 19:01:19 -05:00 committed by GitHub
commit d2f13eced1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/src/app/components/block-prediction-graph/block-prediction-graph.component.ts
View File

@ -98,7 +98,21 @@ export class BlockPredictionGraphComponent implements OnInit {
} }
prepareChartOptions(data) { prepareChartOptions(data) {
let title: object;
if (data.length === 0) {
title = {
textStyle: {
color: 'grey',
fontSize: 15
},
text: $localize`No data to display yet. Try again later.`,
left: 'center',
top: 'center'
};
}
this.chartOptions = { this.chartOptions = {
title: data.length === 0 ? title : undefined,
animation: false, animation: false,
grid: { grid: {
top: 30, top: 30,
@ -133,14 +147,13 @@ export class BlockPredictionGraphComponent implements OnInit {
return tooltip; return tooltip;
} }
}, },
xAxis: { xAxis: data.length === 0 ? undefined : {
name: formatterXAxisLabel(this.locale, this.timespan), name: formatterXAxisLabel(this.locale, this.timespan),
nameLocation: 'middle', nameLocation: 'middle',
nameTextStyle: { nameTextStyle: {
padding: [10, 0, 0, 0], padding: [10, 0, 0, 0],
}, },
type: 'category', type: 'category',
boundaryGap: false,
axisLine: { onZero: true }, axisLine: { onZero: true },
axisLabel: { axisLabel: {
formatter: val => formatterXAxisTimeCategory(this.locale, this.timespan, parseInt(val, 10)), formatter: val => formatterXAxisTimeCategory(this.locale, this.timespan, parseInt(val, 10)),
@ -152,7 +165,7 @@ export class BlockPredictionGraphComponent implements OnInit {
}, },
data: data.map(prediction => prediction[0]) data: data.map(prediction => prediction[0])
}, },
yAxis: [ yAxis: data.length === 0 ? undefined : [
{ {
type: 'value', type: 'value',
axisLabel: { axisLabel: {
@ -170,7 +183,7 @@ export class BlockPredictionGraphComponent implements OnInit {
}, },
}, },
], ],
series: [ series: data.length === 0 ? undefined : [
{ {
zlevel: 0, zlevel: 0,
name: $localize`Match rate`, name: $localize`Match rate`,
@ -183,9 +196,10 @@ export class BlockPredictionGraphComponent implements OnInit {
})), })),
type: 'bar', type: 'bar',
barWidth: '90%', barWidth: '90%',
barMaxWidth: 50,
}, },
], ],
dataZoom: [{ dataZoom: data.length === 0 ? undefined : [{
type: 'inside', type: 'inside',
realtime: true, realtime: true,
zoomLock: true, zoomLock: true,