diff --git a/frontend/src/app/lightning/node/node.component.html b/frontend/src/app/lightning/node/node.component.html index ac50ed51b..de6c816f0 100644 --- a/frontend/src/app/lightning/node/node.component.html +++ b/frontend/src/app/lightning/node/node.component.html @@ -102,9 +102,7 @@ -
- -
+
-
- + -
-
-

All channels ({{ channelsListStatus === 'open' ? node.opened_channel_count : node.closed_channel_count }})

-
- -
+

Channels ({{ channelsListStatus === 'open' ? node.opened_channel_count : node.closed_channel_count }})

- - -
-
\ No newline at end of file +
diff --git a/frontend/src/app/lightning/node/node.component.ts b/frontend/src/app/lightning/node/node.component.ts index 6f9358090..a81849388 100644 --- a/frontend/src/app/lightning/node/node.component.ts +++ b/frontend/src/app/lightning/node/node.component.ts @@ -19,7 +19,6 @@ export class NodeComponent implements OnInit { publicKey$: Observable; selectedSocketIndex = 0; qrCodeVisible = false; - channelsListMode = 'list'; channelsListStatus: string; error: Error; publicKey: string; @@ -83,14 +82,6 @@ export class NodeComponent implements OnInit { this.selectedSocketIndex = index; } - channelsListModeChange(toggle) { - if (toggle === true) { - this.channelsListMode = 'map'; - } else { - this.channelsListMode = 'list'; - } - } - onChannelsListStatusChanged(e) { this.channelsListStatus = e; } diff --git a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html index 1208a906a..5ccb9f3bc 100644 --- a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html +++ b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html @@ -3,9 +3,6 @@
Lightning nodes channels world map -
(Tor nodes excluded)
diff --git a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss index 7914a5364..7e6b9f050 100644 --- a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss +++ b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss @@ -20,7 +20,8 @@ } .full-container.nodepage { - margin-top: 50px; + margin-top: 25px; + margin-bottom: 25px; } .full-container.widget { diff --git a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.ts b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.ts index c71ff88ad..e0063858b 100644 --- a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.ts +++ b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.ts @@ -3,7 +3,6 @@ import { SeoService } from 'src/app/services/seo.service'; import { ApiService } from 'src/app/services/api.service'; import { Observable, switchMap, tap, zip } from 'rxjs'; import { AssetsService } from 'src/app/services/assets.service'; -import { download } from 'src/app/shared/graphs.utils'; import { ActivatedRoute, ParamMap, Router } from '@angular/router'; import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.pipe'; import { StateService } from 'src/app/services/state.service'; @@ -21,6 +20,7 @@ export class NodesChannelsMap implements OnInit, OnDestroy { @Input() publicKey: string | undefined; observable$: Observable; + center: number[] | undefined = undefined; chartInstance = undefined; chartOptions: EChartsOption = {}; @@ -42,6 +42,8 @@ export class NodesChannelsMap implements OnInit, OnDestroy { ngOnDestroy(): void {} ngOnInit(): void { + this.center = this.style === 'widget' ? [0, 0, -10] : undefined; + if (this.style === 'graph') { this.seoService.setTitle($localize`Lightning nodes channels world map`); } @@ -52,13 +54,21 @@ export class NodesChannelsMap implements OnInit, OnDestroy { return zip( this.assetsService.getWorldMapJson$, this.apiService.getChannelsGeo$(params.get('public_key') ?? undefined), + [params.get('public_key') ?? undefined] ).pipe(tap((data) => { registerMap('world', data[0]); const channelsLoc = []; const nodes = []; const nodesPubkeys = {}; + let thisNodeGPS: number[] | undefined = undefined; for (const channel of data[1]) { + if (!thisNodeGPS && data[2] === channel[0]) { + thisNodeGPS = [channel[2], channel[3]]; + } else if (!thisNodeGPS && data[2] === channel[4]) { + thisNodeGPS = [channel[6], channel[7]]; + } + channelsLoc.push([[channel[2], channel[3]], [channel[6], channel[7]]]); if (!nodesPubkeys[channel[0]]) { nodes.push({ @@ -77,6 +87,13 @@ export class NodesChannelsMap implements OnInit, OnDestroy { nodesPubkeys[channel[4]] = true; } } + if (this.style === 'nodepage' && thisNodeGPS) { + // 1ML 0217890e3aad8d35bc054f43acc00084b25229ecff0ab68debd82883ad65ee8266 + // New York GPS [-74.0068, 40.7123] + // Map center [-20.55, 0, -9.85] + this.center = [thisNodeGPS[0] * -20.55 / -74.0068, 0, thisNodeGPS[1] * -9.85 / 40.7123]; + } + this.prepareChartOptions(nodes, channelsLoc); })); }) @@ -111,10 +128,10 @@ export class NodesChannelsMap implements OnInit, OnDestroy { } }, viewControl: { - center: this.style === 'widget' ? [0, 0, -10] : undefined, + center: this.center, minDistance: 1, maxDistance: 60, - distance: this.style === 'widget' ? 22 : 60, + distance: this.style === 'widget' ? 22 : this.style === 'nodepage' ? 22 : 60, alpha: 90, rotateSensitivity: 0, panSensitivity: this.style === 'widget' ? 0 : 1, @@ -204,22 +221,4 @@ export class NodesChannelsMap implements OnInit, OnDestroy { } }); } - - onSaveChart() { - // @ts-ignore - const prevBottom = this.chartOptions.grid.bottom; - const now = new Date(); - // @ts-ignore - this.chartOptions.grid.bottom = 30; - this.chartOptions.backgroundColor = '#11131f'; - this.chartInstance.setOption(this.chartOptions); - download(this.chartInstance.getDataURL({ - pixelRatio: 2, - excludeComponents: ['dataZoom'], - }), `lightning-nodes-heatmap-clearnet-${Math.round(now.getTime() / 1000)}.svg`); - // @ts-ignore - this.chartOptions.grid.bottom = prevBottom; - this.chartOptions.backgroundColor = 'none'; - this.chartInstance.setOption(this.chartOptions); - } }