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

restore incoming tx clearance line, smooth moving avg

Browse Source
This commit is contained in:
Mononaut 2023-11-12 07:59:06 +00:00
parent 3de779ea13
commit fc52514c31
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
2 changed files with 26 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts
View File

@ -63,7 +63,8 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges, On
return; return;
} }
this.windowPreference = this.windowPreferenceOverride ? this.windowPreferenceOverride : this.storageService.getValue('graphWindowPreference'); this.windowPreference = this.windowPreferenceOverride ? this.windowPreferenceOverride : this.storageService.getValue('graphWindowPreference');
this.MA = this.calculateMA(this.data.series[0]); const windowSize = Math.max(10, Math.floor(this.data.series[0].length / 8));
this.MA = this.calculateMA(this.data.series[0], windowSize);
this.mountChart(); this.mountChart();
} }
@ -74,33 +75,22 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges, On
this.isLoading = false; this.isLoading = false;
} }
/// calculate the moving average of maData /// calculate the moving average of the provided data based on windowSize
calculateMA(maData): number[][] { calculateMA(data: number[][], windowSize: number = 100): number[][] {
//update const variables that are not changed //update const variables that are not changed
const ma: number[][] = []; const ma: number[][] = [];
let sum = 0; let sum = 0;
let i = 0; let i = 0;
const len = maData.length;
//Adjust window length based on the length of the data
//5% appeared as a good amount from tests
//TODO: make this a text box in the UI
const maWindowLen = Math.ceil(len * 0.05);
//calculate the center of the moving average window
const center = Math.floor(maWindowLen / 2);
//calculate the centered moving average //calculate the centered moving average
for (i = center; i < len - center; i++) { for (i = 0; i < data.length; i++) {
sum = 0; sum += data[i][1];
//build out ma as we loop through the data if (i >= windowSize) {
ma[i] = []; sum -= data[i - windowSize][1];
ma[i].push(maData[i][0]); const midpoint = i - Math.floor(windowSize / 2);
for (let j = i - center; j <= i + center; j++) { const avg = sum / windowSize;
sum += maData[j][1]; ma.push([data[midpoint][0], avg]);
} }
ma[i].push(sum / maWindowLen);
} }
//return the moving average array //return the moving average array
@ -138,36 +128,22 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges, On
} }
}], }],
} }
}, });
{ if (this.template !== 'widget') {
zlevel: 0, seriesGraph.push({
name: 'MA', zlevel: 0,
data: this.MA, name: 'MA',
type: 'line', data: this.MA,
smooth: false, type: 'line',
showSymbol: false, smooth: false,
symbol: 'none', showSymbol: false,
lineStyle: {
width: 1,
color: "white",
},
markLine: {
silent: true,
symbol: 'none', symbol: 'none',
lineStyle: { lineStyle: {
color: '#fff',
opacity: 1,
width: 2, width: 2,
}, color: "white",
data: [{ }
yAxis: 1667, });
label: { }
show: false,
color: '#ffffff',
}
}],
}
});
this.mempoolStatsChartOption = { this.mempoolStatsChartOption = {
grid: { grid: {

4
frontend/src/app/graphs/echarts.ts
View File

@ -1,7 +1,7 @@
// Import tree-shakeable echarts // Import tree-shakeable echarts
import * as echarts from 'echarts/core'; import * as echarts from 'echarts/core';
import { LineChart, LinesChart, BarChart, TreemapChart, PieChart, ScatterChart } from 'echarts/charts'; import { LineChart, LinesChart, BarChart, TreemapChart, PieChart, ScatterChart } from 'echarts/charts';
import { TitleComponent, TooltipComponent, GridComponent, LegendComponent, GeoComponent, DataZoomComponent, VisualMapComponent } from 'echarts/components'; import { TitleComponent, TooltipComponent, GridComponent, LegendComponent, GeoComponent, DataZoomComponent, VisualMapComponent, MarkLineComponent } from 'echarts/components';
import { SVGRenderer, CanvasRenderer } from 'echarts/renderers'; import { SVGRenderer, CanvasRenderer } from 'echarts/renderers';
// Typescript interfaces // Typescript interfaces
import { EChartsOption, TreemapSeriesOption, LineSeriesOption, PieSeriesOption } from 'echarts'; import { EChartsOption, TreemapSeriesOption, LineSeriesOption, PieSeriesOption } from 'echarts';
@ -11,7 +11,7 @@ echarts.use([
SVGRenderer, CanvasRenderer, SVGRenderer, CanvasRenderer,
TitleComponent, TooltipComponent, GridComponent, TitleComponent, TooltipComponent, GridComponent,
LegendComponent, GeoComponent, DataZoomComponent, LegendComponent, GeoComponent, DataZoomComponent,
VisualMapComponent, VisualMapComponent, MarkLineComponent,
LineChart, LinesChart, BarChart, TreemapChart, PieChart, ScatterChart LineChart, LinesChart, BarChart, TreemapChart, PieChart, ScatterChart
]); ]);
export { echarts, EChartsOption, TreemapSeriesOption, LineSeriesOption, PieSeriesOption }; export { echarts, EChartsOption, TreemapSeriesOption, LineSeriesOption, PieSeriesOption };