mirror of
https://github.com/mempool/mempool.git
synced 2025-03-15 04:11:48 +01:00
Shake the echarts tree
This commit is contained in:
parent
79fb0a34dc
commit
a33dc74c88
25 changed files with 60 additions and 45 deletions
|
@ -85,7 +85,6 @@
|
||||||
"clipboard": "^2.0.11",
|
"clipboard": "^2.0.11",
|
||||||
"domino": "^2.1.6",
|
"domino": "^2.1.6",
|
||||||
"echarts": "~5.4.3",
|
"echarts": "~5.4.3",
|
||||||
"echarts-gl": "^2.0.9",
|
|
||||||
"lightweight-charts": "~3.8.0",
|
"lightweight-charts": "~3.8.0",
|
||||||
"ngx-echarts": "~16.0.0",
|
"ngx-echarts": "~16.0.0",
|
||||||
"ngx-infinite-scroll": "^16.0.0",
|
"ngx-infinite-scroll": "^16.0.0",
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, NgZone, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, NgZone, OnInit } from '@angular/core';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable, Subscription, combineLatest } from 'rxjs';
|
import { Observable, Subscription, combineLatest } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
|
||||||
import { EChartsOption, graphic } from 'echarts';
|
import { echarts, EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
@ -123,11 +123,11 @@ export class BlockFeesGraphComponent implements OnInit {
|
||||||
this.chartOptions = {
|
this.chartOptions = {
|
||||||
title: title,
|
title: title,
|
||||||
color: [
|
color: [
|
||||||
new graphic.LinearGradient(0, 0, 0, 1, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
{ offset: 0, color: '#FDD835' },
|
{ offset: 0, color: '#FDD835' },
|
||||||
{ offset: 1, color: '#FB8C00' },
|
{ offset: 1, color: '#FB8C00' },
|
||||||
]),
|
]),
|
||||||
new graphic.LinearGradient(0, 0, 0, 1, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
{ offset: 0, color: '#C0CA33' },
|
{ offset: 0, color: '#C0CA33' },
|
||||||
{ offset: 1, color: '#1B5E20' },
|
{ offset: 1, color: '#1B5E20' },
|
||||||
]),
|
]),
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, NgZone, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, NgZone, OnInit } from '@angular/core';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
|
||||||
import { EChartsOption, graphic } from 'echarts';
|
import { echarts, EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
@ -123,11 +123,11 @@ export class BlockRewardsGraphComponent implements OnInit {
|
||||||
title: title,
|
title: title,
|
||||||
animation: false,
|
animation: false,
|
||||||
color: [
|
color: [
|
||||||
new graphic.LinearGradient(0, 0, 0, 1, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
{ offset: 0, color: '#FDD835' },
|
{ offset: 0, color: '#FDD835' },
|
||||||
{ offset: 1, color: '#FB8C00' },
|
{ offset: 1, color: '#FB8C00' },
|
||||||
]),
|
]),
|
||||||
new graphic.LinearGradient(0, 0, 0, 1, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
{ offset: 0, color: '#C0CA33' },
|
{ offset: 0, color: '#C0CA33' },
|
||||||
{ offset: 1, color: '#1B5E20' },
|
{ offset: 1, color: '#1B5E20' },
|
||||||
]),
|
]),
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||||
import { EChartsOption} from 'echarts';
|
import { EChartsOption} from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||||
import { EChartsOption, graphic } from 'echarts';
|
import { echarts, EChartsOption } from '../../graphs/echarts';
|
||||||
import { merge, Observable, of } from 'rxjs';
|
import { merge, Observable, of } from 'rxjs';
|
||||||
import { map, mergeMap, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, mergeMap, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
@ -204,7 +204,7 @@ export class HashrateChartComponent implements OnInit {
|
||||||
title: title,
|
title: title,
|
||||||
animation: false,
|
animation: false,
|
||||||
color: [
|
color: [
|
||||||
new graphic.LinearGradient(0, 0, 0, 0.65, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 0.65, [
|
||||||
{ offset: 0, color: '#F4511E99' },
|
{ offset: 0, color: '#F4511E99' },
|
||||||
{ offset: 0.25, color: '#FB8C0099' },
|
{ offset: 0.25, color: '#FB8C0099' },
|
||||||
{ offset: 0.5, color: '#FFB30099' },
|
{ offset: 0.5, color: '#FFB30099' },
|
||||||
|
@ -212,7 +212,7 @@ export class HashrateChartComponent implements OnInit {
|
||||||
{ offset: 1, color: '#7CB34299' }
|
{ offset: 1, color: '#7CB34299' }
|
||||||
]),
|
]),
|
||||||
'#D81B60',
|
'#D81B60',
|
||||||
new graphic.LinearGradient(0, 0, 0, 0.65, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 0.65, [
|
||||||
{ offset: 0, color: '#F4511E' },
|
{ offset: 0, color: '#F4511E' },
|
||||||
{ offset: 0.25, color: '#FB8C00' },
|
{ offset: 0.25, color: '#FB8C00' },
|
||||||
{ offset: 0.5, color: '#FFB300' },
|
{ offset: 0.5, color: '#FFB300' },
|
||||||
|
@ -342,7 +342,7 @@ export class HashrateChartComponent implements OnInit {
|
||||||
type: 'value',
|
type: 'value',
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: 'rgb(110, 112, 121)',
|
color: 'rgb(110, 112, 121)',
|
||||||
formatter: (val) => {
|
formatter: (val): string => {
|
||||||
const selectedPowerOfTen: any = selectPowerOfTen(val);
|
const selectedPowerOfTen: any = selectPowerOfTen(val);
|
||||||
const newVal = Math.round(val / selectedPowerOfTen.divider);
|
const newVal = Math.round(val / selectedPowerOfTen.divider);
|
||||||
return `${newVal} ${selectedPowerOfTen.unit}H/s`;
|
return `${newVal} ${selectedPowerOfTen.unit}H/s`;
|
||||||
|
@ -364,9 +364,9 @@ export class HashrateChartComponent implements OnInit {
|
||||||
position: 'right',
|
position: 'right',
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: 'rgb(110, 112, 121)',
|
color: 'rgb(110, 112, 121)',
|
||||||
formatter: (val) => {
|
formatter: (val): string => {
|
||||||
if (this.stateService.network === 'signet') {
|
if (this.stateService.network === 'signet') {
|
||||||
return val;
|
return `${val}`;
|
||||||
}
|
}
|
||||||
const selectedPowerOfTen: any = selectPowerOfTen(val);
|
const selectedPowerOfTen: any = selectPowerOfTen(val);
|
||||||
const newVal = Math.round(val / selectedPowerOfTen.divider);
|
const newVal = Math.round(val / selectedPowerOfTen.divider);
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { delay, map, retryWhen, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { delay, map, retryWhen, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { Component, Input, Inject, LOCALE_ID, ChangeDetectionStrategy, OnInit, OnDestroy } from '@angular/core';
|
import { Component, Input, Inject, LOCALE_ID, ChangeDetectionStrategy, OnInit, OnDestroy } from '@angular/core';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
import { OnChanges } from '@angular/core';
|
import { OnChanges } from '@angular/core';
|
||||||
import { StorageService } from '../../services/storage.service';
|
import { StorageService } from '../../services/storage.service';
|
||||||
import { download, formatterXAxis, formatterXAxisLabel } from '../../shared/graphs.utils';
|
import { download, formatterXAxis, formatterXAxisLabel } from '../../shared/graphs.utils';
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { Component, Inject, LOCALE_ID, ChangeDetectionStrategy, Input, OnChanges, OnInit } from '@angular/core';
|
import { Component, Inject, LOCALE_ID, ChangeDetectionStrategy, Input, OnChanges, OnInit } from '@angular/core';
|
||||||
import { formatDate, formatNumber } from '@angular/common';
|
import { formatDate, formatNumber } from '@angular/common';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-lbtc-pegs-graph',
|
selector: 'app-lbtc-pegs-graph',
|
||||||
|
|
|
@ -6,7 +6,7 @@ import { formatNumber } from '@angular/common';
|
||||||
import { OptimizedMempoolStats } from '../../interfaces/node-api.interface';
|
import { OptimizedMempoolStats } from '../../interfaces/node-api.interface';
|
||||||
import { StateService } from '../../services/state.service';
|
import { StateService } from '../../services/state.service';
|
||||||
import { StorageService } from '../../services/storage.service';
|
import { StorageService } from '../../services/storage.service';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
import { feeLevels, chartColors } from '../../app.constants';
|
import { feeLevels, chartColors } from '../../app.constants';
|
||||||
import { download, formatterXAxis, formatterXAxisLabel } from '../../shared/graphs.utils';
|
import { download, formatterXAxis, formatterXAxisLabel } from '../../shared/graphs.utils';
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { ChangeDetectionStrategy, Component, Input, NgZone, OnInit, HostBinding } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Input, NgZone, OnInit, HostBinding } from '@angular/core';
|
||||||
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
|
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
|
||||||
import { ActivatedRoute, Router } from '@angular/router';
|
import { ActivatedRoute, Router } from '@angular/router';
|
||||||
import { EChartsOption, PieSeriesOption } from 'echarts';
|
import { EChartsOption, PieSeriesOption } from '../../graphs/echarts';
|
||||||
import { merge, Observable } from 'rxjs';
|
import { merge, Observable } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { SeoService } from '../../services/seo.service';
|
import { SeoService } from '../../services/seo.service';
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, LOCALE_ID, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, LOCALE_ID, OnInit } from '@angular/core';
|
||||||
import { ActivatedRoute } from '@angular/router';
|
import { ActivatedRoute } from '@angular/router';
|
||||||
import { EChartsOption, graphic } from 'echarts';
|
import { echarts, EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable, of } from 'rxjs';
|
import { Observable, of } from 'rxjs';
|
||||||
import { map, switchMap, catchError } from 'rxjs/operators';
|
import { map, switchMap, catchError } from 'rxjs/operators';
|
||||||
import { PoolStat } from '../../interfaces/node-api.interface';
|
import { PoolStat } from '../../interfaces/node-api.interface';
|
||||||
|
@ -127,7 +127,7 @@ export class PoolPreviewComponent implements OnInit {
|
||||||
title: title,
|
title: title,
|
||||||
animation: false,
|
animation: false,
|
||||||
color: [
|
color: [
|
||||||
new graphic.LinearGradient(0, 0, 0, 0.65, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 0.65, [
|
||||||
{ offset: 0, color: '#F4511E' },
|
{ offset: 0, color: '#F4511E' },
|
||||||
{ offset: 0.25, color: '#FB8C00' },
|
{ offset: 0.25, color: '#FB8C00' },
|
||||||
{ offset: 0.5, color: '#FFB300' },
|
{ offset: 0.5, color: '#FFB300' },
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
|
||||||
import { ActivatedRoute } from '@angular/router';
|
import { ActivatedRoute } from '@angular/router';
|
||||||
import { EChartsOption, graphic } from 'echarts';
|
import { echarts, EChartsOption } from '../../graphs/echarts';
|
||||||
import { BehaviorSubject, Observable, of, timer } from 'rxjs';
|
import { BehaviorSubject, Observable, of, timer } from 'rxjs';
|
||||||
import { catchError, distinctUntilChanged, map, share, switchMap, tap } from 'rxjs/operators';
|
import { catchError, distinctUntilChanged, map, share, switchMap, tap } from 'rxjs/operators';
|
||||||
import { BlockExtended, PoolStat } from '../../interfaces/node-api.interface';
|
import { BlockExtended, PoolStat } from '../../interfaces/node-api.interface';
|
||||||
|
@ -131,7 +131,7 @@ export class PoolComponent implements OnInit {
|
||||||
title: title,
|
title: title,
|
||||||
animation: false,
|
animation: false,
|
||||||
color: [
|
color: [
|
||||||
new graphic.LinearGradient(0, 0, 0, 0.65, [
|
new echarts.graphic.LinearGradient(0, 0, 0, 0.65, [
|
||||||
{ offset: 0, color: '#F4511E' },
|
{ offset: 0, color: '#F4511E' },
|
||||||
{ offset: 0.25, color: '#FB8C00' },
|
{ offset: 0.25, color: '#FB8C00' },
|
||||||
{ offset: 0.5, color: '#FFB300' },
|
{ offset: 0.5, color: '#FFB300' },
|
||||||
|
|
17
frontend/src/app/graphs/echarts.ts
Normal file
17
frontend/src/app/graphs/echarts.ts
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
// Import tree-shakeable echarts
|
||||||
|
import * as echarts from 'echarts/core';
|
||||||
|
import { LineChart, LinesChart, BarChart, TreemapChart, PieChart, ScatterChart } from 'echarts/charts';
|
||||||
|
import { TitleComponent, TooltipComponent, GridComponent, LegendComponent, GeoComponent, DataZoomComponent, VisualMapComponent } from 'echarts/components';
|
||||||
|
import { SVGRenderer, CanvasRenderer } from 'echarts/renderers';
|
||||||
|
// Typescript interfaces
|
||||||
|
import { EChartsOption, TreemapSeriesOption, LineSeriesOption, PieSeriesOption } from 'echarts';
|
||||||
|
|
||||||
|
|
||||||
|
echarts.use([
|
||||||
|
SVGRenderer, CanvasRenderer,
|
||||||
|
TitleComponent, TooltipComponent, GridComponent,
|
||||||
|
LegendComponent, GeoComponent, DataZoomComponent,
|
||||||
|
VisualMapComponent,
|
||||||
|
LineChart, LinesChart, BarChart, TreemapChart, PieChart, ScatterChart
|
||||||
|
]);
|
||||||
|
export { echarts, EChartsOption, TreemapSeriesOption, LineSeriesOption, PieSeriesOption };
|
|
@ -53,7 +53,7 @@ import { CommonModule } from '@angular/common';
|
||||||
SharedModule,
|
SharedModule,
|
||||||
GraphsRoutingModule,
|
GraphsRoutingModule,
|
||||||
NgxEchartsModule.forRoot({
|
NgxEchartsModule.forRoot({
|
||||||
echarts: () => import('echarts')
|
echarts: () => import('./echarts').then(m => m.echarts),
|
||||||
})
|
})
|
||||||
],
|
],
|
||||||
exports: [
|
exports: [
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
import { Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
import { switchMap } from 'rxjs/operators';
|
import { switchMap } from 'rxjs/operators';
|
||||||
import { download } from '../../shared/graphs.utils';
|
import { download } from '../../shared/graphs.utils';
|
||||||
import { LightningApiService } from '../lightning-api.service';
|
import { LightningApiService } from '../lightning-api.service';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
import { Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||||
import { EChartsOption } from 'echarts';
|
import { EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { switchMap, tap } from 'rxjs/operators';
|
import { switchMap, tap } from 'rxjs/operators';
|
||||||
import { formatNumber } from '@angular/common';
|
import { formatNumber } from '@angular/common';
|
||||||
|
|
|
@ -6,8 +6,7 @@ import { AssetsService } from '../../services/assets.service';
|
||||||
import { ActivatedRoute, ParamMap, Router } from '@angular/router';
|
import { ActivatedRoute, ParamMap, Router } from '@angular/router';
|
||||||
import { RelativeUrlPipe } from '../../shared/pipes/relative-url/relative-url.pipe';
|
import { RelativeUrlPipe } from '../../shared/pipes/relative-url/relative-url.pipe';
|
||||||
import { StateService } from '../../services/state.service';
|
import { StateService } from '../../services/state.service';
|
||||||
import { EChartsOption, registerMap } from 'echarts';
|
import { EChartsOption, echarts } from '../../graphs/echarts';
|
||||||
import 'echarts-gl';
|
|
||||||
import { isMobile } from '../../shared/common.utils';
|
import { isMobile } from '../../shared/common.utils';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -88,7 +87,7 @@ export class NodesChannelsMap implements OnInit {
|
||||||
this.style !== 'channelpage' ? this.apiService.getChannelsGeo$(params.get('public_key') ?? undefined, this.style) : [''],
|
this.style !== 'channelpage' ? this.apiService.getChannelsGeo$(params.get('public_key') ?? undefined, this.style) : [''],
|
||||||
[params.get('public_key') ?? undefined]
|
[params.get('public_key') ?? undefined]
|
||||||
).pipe(tap((data) => {
|
).pipe(tap((data) => {
|
||||||
registerMap('world', data[0]);
|
echarts.registerMap('world', data[0]);
|
||||||
|
|
||||||
const channelsLoc = [];
|
const channelsLoc = [];
|
||||||
const nodes = [];
|
const nodes = [];
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { formatNumber } from '@angular/common';
|
import { formatNumber } from '@angular/common';
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, NgZone, OnChanges } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, NgZone, OnChanges } from '@angular/core';
|
||||||
import { Router } from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
import { ECharts, EChartsOption, TreemapSeriesOption } from 'echarts';
|
import { EChartsOption, TreemapSeriesOption } from '../../graphs/echarts';
|
||||||
import { Observable, share, switchMap, tap } from 'rxjs';
|
import { Observable, share, switchMap, tap } from 'rxjs';
|
||||||
import { lerpColor } from '../../shared/graphs.utils';
|
import { lerpColor } from '../../shared/graphs.utils';
|
||||||
import { AmountShortenerPipe } from '../../shared/pipes/amount-shortener.pipe';
|
import { AmountShortenerPipe } from '../../shared/pipes/amount-shortener.pipe';
|
||||||
|
@ -18,7 +18,7 @@ import { StateService } from '../../services/state.service';
|
||||||
export class NodeChannels implements OnChanges {
|
export class NodeChannels implements OnChanges {
|
||||||
@Input() publicKey: string;
|
@Input() publicKey: string;
|
||||||
|
|
||||||
chartInstance: ECharts;
|
chartInstance: any;
|
||||||
chartOptions: EChartsOption = {};
|
chartOptions: EChartsOption = {};
|
||||||
chartInitOptions = {
|
chartInitOptions = {
|
||||||
renderer: 'svg',
|
renderer: 'svg',
|
||||||
|
@ -129,7 +129,7 @@ export class NodeChannels implements OnChanges {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
onChartInit(ec: ECharts): void {
|
onChartInit(ec: any): void {
|
||||||
this.chartInstance = ec;
|
this.chartInstance = ec;
|
||||||
|
|
||||||
this.chartInstance.on('click', (e) => {
|
this.chartInstance.on('click', (e) => {
|
||||||
|
|
|
@ -3,7 +3,7 @@ import { SeoService } from '../../services/seo.service';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
import { Observable, BehaviorSubject, switchMap, tap, combineLatest } from 'rxjs';
|
import { Observable, BehaviorSubject, switchMap, tap, combineLatest } from 'rxjs';
|
||||||
import { AssetsService } from '../../services/assets.service';
|
import { AssetsService } from '../../services/assets.service';
|
||||||
import { EChartsOption, registerMap } from 'echarts';
|
import { EChartsOption, echarts } from '../../graphs/echarts';
|
||||||
import { lerpColor } from '../../shared/graphs.utils';
|
import { lerpColor } from '../../shared/graphs.utils';
|
||||||
import { Router } from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
import { RelativeUrlPipe } from '../../shared/pipes/relative-url/relative-url.pipe';
|
import { RelativeUrlPipe } from '../../shared/pipes/relative-url/relative-url.pipe';
|
||||||
|
@ -63,7 +63,7 @@ export class NodesMap implements OnInit, OnChanges {
|
||||||
this.assetsService.getWorldMapJson$,
|
this.assetsService.getWorldMapJson$,
|
||||||
this.nodes$
|
this.nodes$
|
||||||
).pipe(tap((data) => {
|
).pipe(tap((data) => {
|
||||||
registerMap('world', data[0]);
|
echarts.registerMap('world', data[0]);
|
||||||
|
|
||||||
let maxLiquidity = data[1].maxLiquidity;
|
let maxLiquidity = data[1].maxLiquidity;
|
||||||
let inputNodes: any[] = data[1].nodes;
|
let inputNodes: any[] = data[1].nodes;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||||
import { EChartsOption, graphic, LineSeriesOption} from 'echarts';
|
import { echarts, EChartsOption, LineSeriesOption } from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { formatNumber } from '@angular/common';
|
import { formatNumber } from '@angular/common';
|
||||||
|
@ -152,7 +152,7 @@ export class NodesNetworksChartComponent implements OnInit {
|
||||||
opacity: 0.5,
|
opacity: 0.5,
|
||||||
},
|
},
|
||||||
stack: 'Total',
|
stack: 'Total',
|
||||||
color: new graphic.LinearGradient(0, 0.75, 0, 1, [
|
color: new echarts.graphic.LinearGradient(0, 0.75, 0, 1, [
|
||||||
{ offset: 0, color: '#D81B60' },
|
{ offset: 0, color: '#D81B60' },
|
||||||
{ offset: 1, color: '#D81B60AA' },
|
{ offset: 1, color: '#D81B60AA' },
|
||||||
]),
|
]),
|
||||||
|
@ -174,7 +174,7 @@ export class NodesNetworksChartComponent implements OnInit {
|
||||||
opacity: 0.5,
|
opacity: 0.5,
|
||||||
},
|
},
|
||||||
stack: 'Total',
|
stack: 'Total',
|
||||||
color: new graphic.LinearGradient(0, 0.75, 0, 1, [
|
color: new echarts.graphic.LinearGradient(0, 0.75, 0, 1, [
|
||||||
{ offset: 0, color: '#be7d4c' },
|
{ offset: 0, color: '#be7d4c' },
|
||||||
{ offset: 1, color: '#be7d4cAA' },
|
{ offset: 1, color: '#be7d4cAA' },
|
||||||
]),
|
]),
|
||||||
|
@ -195,7 +195,7 @@ export class NodesNetworksChartComponent implements OnInit {
|
||||||
opacity: 0.5,
|
opacity: 0.5,
|
||||||
},
|
},
|
||||||
stack: 'Total',
|
stack: 'Total',
|
||||||
color: new graphic.LinearGradient(0, 0.75, 0, 1, [
|
color: new echarts.graphic.LinearGradient(0, 0.75, 0, 1, [
|
||||||
{ offset: 0, color: '#FFB300' },
|
{ offset: 0, color: '#FFB300' },
|
||||||
{ offset: 1, color: '#FFB300AA' },
|
{ offset: 1, color: '#FFB300AA' },
|
||||||
]),
|
]),
|
||||||
|
@ -216,7 +216,7 @@ export class NodesNetworksChartComponent implements OnInit {
|
||||||
opacity: 0.5,
|
opacity: 0.5,
|
||||||
},
|
},
|
||||||
stack: 'Total',
|
stack: 'Total',
|
||||||
color: new graphic.LinearGradient(0, 0.75, 0, 1, [
|
color: new echarts.graphic.LinearGradient(0, 0.75, 0, 1, [
|
||||||
{ offset: 0, color: '#7D4698' },
|
{ offset: 0, color: '#7D4698' },
|
||||||
{ offset: 1, color: '#7D4698AA' },
|
{ offset: 1, color: '#7D4698AA' },
|
||||||
]),
|
]),
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { ChangeDetectionStrategy, Component, OnInit, HostBinding, NgZone } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, OnInit, HostBinding, NgZone } from '@angular/core';
|
||||||
import { Router } from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
import { EChartsOption, PieSeriesOption } from 'echarts';
|
import { EChartsOption, PieSeriesOption } from '../../graphs/echarts';
|
||||||
import { map, Observable, share, tap } from 'rxjs';
|
import { map, Observable, share, tap } from 'rxjs';
|
||||||
import { chartColors } from '../../app.constants';
|
import { chartColors } from '../../app.constants';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { ChangeDetectionStrategy, Component, OnInit, HostBinding, NgZone, Input } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, OnInit, HostBinding, NgZone, Input } from '@angular/core';
|
||||||
import { Router } from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
import { EChartsOption, PieSeriesOption } from 'echarts';
|
import { EChartsOption, PieSeriesOption } from '../../graphs/echarts';
|
||||||
import { combineLatest, map, Observable, share, startWith, Subject, switchMap, tap } from 'rxjs';
|
import { combineLatest, map, Observable, share, startWith, Subject, switchMap, tap } from 'rxjs';
|
||||||
import { chartColors } from '../../app.constants';
|
import { chartColors } from '../../app.constants';
|
||||||
import { ApiService } from '../../services/api.service';
|
import { ApiService } from '../../services/api.service';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
import { Component, Inject, Input, LOCALE_ID, OnInit, HostBinding } from '@angular/core';
|
||||||
import { EChartsOption, graphic } from 'echarts';
|
import { echarts, EChartsOption } from '../../graphs/echarts';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
|
||||||
import { SeoService } from '../../services/seo.service';
|
import { SeoService } from '../../services/seo.service';
|
||||||
|
@ -132,7 +132,7 @@ export class LightningStatisticsChartComponent implements OnInit {
|
||||||
animation: false,
|
animation: false,
|
||||||
color: [
|
color: [
|
||||||
'#FFB300',
|
'#FFB300',
|
||||||
new graphic.LinearGradient(0, 0.75, 0, 1, [
|
new echarts.graphic.LinearGradient(0, 0.75, 0, 1, [
|
||||||
{ offset: 0, color: '#D81B60' },
|
{ offset: 0, color: '#D81B60' },
|
||||||
{ offset: 1, color: '#D81B60AA' },
|
{ offset: 1, color: '#D81B60AA' },
|
||||||
]),
|
]),
|
||||||
|
|
Loading…
Add table
Reference in a new issue