diff --git a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html
index f327a7147..abc0e306c 100644
--- a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html
+++ b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html
@@ -35,7 +35,11 @@
{{ country.rank }} |
- {{ country.name.en }}
+
|
{{ country.share }}% |
{{ country.count }} |
diff --git a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.ts b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.ts
index cee350a34..c6a640015 100644
--- a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.ts
+++ b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.ts
@@ -9,6 +9,7 @@ import { StateService } from 'src/app/services/state.service';
import { download } from 'src/app/shared/graphs.utils';
import { AmountShortenerPipe } from 'src/app/shared/pipes/amount-shortener.pipe';
import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.pipe';
+import { getFlagEmoji } from 'src/app/shared/graphs.utils';
@Component({
selector: 'app-nodes-per-country-chart',
@@ -50,6 +51,7 @@ export class NodesPerCountryChartComponent implements OnInit {
for (let i = 0; i < data.length; ++i) {
data[i].rank = i + 1;
data[i].iso = data[i].iso.toLowerCase();
+ data[i].flag = getFlagEmoji(data[i].iso);
}
return data.slice(0, 100);
}),
diff --git a/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html b/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html
index 82280bdab..2896b4544 100644
--- a/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html
+++ b/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html
@@ -1,5 +1,8 @@
-
Lightning nodes in {{ country }}
+
+ Lightning nodes in {{ country?.name }}
+ {{ country?.flag }}
+
diff --git a/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.ts b/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.ts
index e353d1361..a247baadf 100644
--- a/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.ts
+++ b/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.ts
@@ -3,6 +3,7 @@ import { ActivatedRoute } from '@angular/router';
import { map, Observable } from 'rxjs';
import { ApiService } from 'src/app/services/api.service';
import { SeoService } from 'src/app/services/seo.service';
+import { getFlagEmoji } from 'src/app/shared/graphs.utils';
@Component({
selector: 'app-nodes-per-country',
@@ -12,7 +13,7 @@ import { SeoService } from 'src/app/services/seo.service';
})
export class NodesPerCountry implements OnInit {
nodes$: Observable;
- country: string;
+ country: {name: string, flag: string};
constructor(
private apiService: ApiService,
@@ -24,8 +25,11 @@ export class NodesPerCountry implements OnInit {
this.nodes$ = this.apiService.getNodeForCountry$(this.route.snapshot.params.country)
.pipe(
map(response => {
- this.country = response.country.en
- this.seoService.setTitle($localize`Lightning nodes in ${this.country}`);
+ this.country = {
+ name: response.country.en,
+ flag: getFlagEmoji(this.route.snapshot.params.country)
+ };
+ this.seoService.setTitle($localize`Lightning nodes in ${this.country.name}`);
return response.nodes;
})
);
diff --git a/frontend/src/app/shared/graphs.utils.ts b/frontend/src/app/shared/graphs.utils.ts
index 2e103ecda..6909e6fac 100644
--- a/frontend/src/app/shared/graphs.utils.ts
+++ b/frontend/src/app/shared/graphs.utils.ts
@@ -90,3 +90,11 @@ export function detectWebGL() {
const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
return (gl && gl instanceof WebGLRenderingContext);
}
+
+export function getFlagEmoji(countryCode) {
+ const codePoints = countryCode
+ .toUpperCase()
+ .split('')
+ .map(char => 127397 + char.charCodeAt());
+ return String.fromCodePoint(...codePoints);
+}