This commit is contained in:
SuriyaR 2019-08-07 20:23:30 +05:30
parent 48c0f600ef
commit 92c946fc4d
8 changed files with 417 additions and 223 deletions

View File

@ -1232,7 +1232,7 @@ export class BlockchainBlockController {
// DifficultyCuckatoo: DifficultyCuckatoo,
// DifficultyProgpow: DifficultyProgpow,
Maxrange: Maxrange,
Minrange: (Minrange * 0.3),
Minrange: (Minrange * 0.2),
TargetDifficulty: TargetDifficulty
},
});

View File

@ -7,7 +7,9 @@
"blocks-mined" : "Blöcke abgebaut",
"hashrate-growth-chart" : "HashRate-Wachstumstabelle",
"block-interval" : "Sperrintervall",
"transactions-vs-date" : "Transaktionen nach Datum",
"transactions-vs-date" : "Transaktionen nach Datum",
"total-difficulty" : "Gesamtschwierigkeit",
"target-difficulty" : "Zielschwierigkeit",
"home": {
"HEADER_TEXT": "Sie befinden sich in Beta",
"COUNTDOWN": "Mainnet-Countdown",
@ -62,7 +64,6 @@
"SEARCH_RESULT1" : "Ihr Suchbegriff",
"SEARCH_RESULT2" : "ist zu kurz",
"SEARCH_RESULT3" : "Bitte geben Sie mindestens sechs Zeichen ein, wenn Sie nach Hash suchen",
"total-difficulty" : "Gesamtschwierigkeit",
"PEERS" : "Gleichaltrigen",
"CAPABILITIES" : "Fähigkeiten",
"USER_AGENT" : "User Agent",

View File

@ -7,7 +7,9 @@
"blocks-mined" : "Blocks Mined",
"hashrate-growth-chart" : "HashRate Growth Chart",
"block-interval" : "Block Interval",
"transactions-vs-date" : "Transactions by Date",
"transactions-vs-date" : "Transactions by Date",
"total-difficulty" : "Total Difficulty",
"target-difficulty" : "Target Difficulty",
"home": {
"HEADER_TEXT": "You are on Beta",
"COUNTDOWN": "Mainnet Countdown",

View File

@ -36,6 +36,9 @@ import {
}
@Input() set layout(layout: any) {
this._layout = layout;
if(this._plotlyJs){
this.showChart();
}
}
get layout(): any {
@ -46,6 +49,9 @@ import {
}
@Input() set options(options: any) {
this._options = options;
if(this._plotlyJs){
this.showChart();
}
}
get options(): any {
return this._options;

View File

@ -1,66 +1,145 @@
<div class="view_content detail_graph py-4">
<div class="container">
<div class="container">
<!-- <div *ngIf="this.title=='Total Difficulty'" class="row ">
<div class="row">
<div class="col-md-9">
<div class="box_shadow_large bg-white p-3">
<div class="overflow-hidden">
<div class="blocks detail_graph">
<div class="col-md-9">
<div class="box_shadow_large bg-white p-3">
<div class="overflow-hidden">
<div class="blocks detail_graph">
<h2 class="chart_heading text-uppercase d-inline-block">Total Difficulty</h2>
<epic-explorer-plotly *ngIf="linearTotalGraphData.data" [data]="linearTotalGraphData.data"
[layout]="linearTotalGraphData.layout">
</epic-explorer-plotly>
<div class="day_filter diff_margin">
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '1 day',''); selectedTarget = 6; TdifficultyRange = '1 day'
" id="6" #itemtarget6 [ngClass]="{ active: selectedTarget == itemtarget6.id, txt_primay: true }">1 Day</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '1 week',''); selectedTarget = 1; TdifficultyRange = '1 week'
" id="1" #itemtarget1 [ngClass]="{ active: selectedTarget == itemtarget1.id, txt_primay: true }">1
{{'home.WEEK' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '15 days',''); selectedTarget = 2; TdifficultyRange = '15 days'
" id="2" #itemtarget2 [ngClass]="{ active: selectedTarget == itemtarget2.id, day15_txt: true }">15
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '30 days',''); selectedTarget = 3; TdifficultyRange = '30 days'
" id="3" #itemtarget3 [ngClass]="{ active: selectedTarget == itemtarget3.id, day30_txt: true }">30
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '60 days',''); selectedTarget = 4; TdifficultyRange = '60 days'
" id="4" #itemtarget4 [ngClass]="{ active: selectedTarget == itemtarget4.id, day60_txt: true }">60
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '3 months',''); selectedTarget = 5; TdifficultyRange = '3 months'
" id="5" #itemtarget5 [ngClass]="{ active: selectedTarget == itemtarget5.id, day3m_txt: true }">3
{{'home.MONTHS' | translate}}</a>
</div>
<div class="day_filter">
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', TdifficultyRange,'cuckatoo'); selectedTarget12 = 1
" id="1" #itemtarget121
[ngClass]="{ active: selectedTarget12 == itemtarget121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', TdifficultyRange,'progpow'); selectedTarget12 = 2
" id="2" #itemtarget122
[ngClass]="{ active: selectedTarget12 == itemtarget122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', TdifficultyRange,'randomx'); selectedTarget12 = 3
" id="3" #itemtarget123
[ngClass]="{ active: selectedTarget12 == itemtarget123.id, txt_primay: true }">RandomX</a>
</div>
<h2 class="chart_heading text-uppercase d-inline-block">{{this.title=='Total Difficulty' ? 'Target Difficulty' : this.chartType | translate}}</h2>
<epic-explorer-plotly *ngIf="hashdata.data" [data]="hashdata.data" [layout]="hashdata.layout">
</epic-explorer-plotly>
<div class="day_filter" *ngIf="this.title!='Transactions over time'">
<a href="JavaScript:void(0);" *ngIf="this.title=='Total Difficulty'" (click)="
ChartFromView('', '', '1 day', comp.Type); selectedItem = 6; comp.difficultyRange = '1 day'
" id="6" #item6 [ngClass]="{ active: selectedItem == item6.id, txt_primay: true }">1 Day</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '1 week', comp.Type); selectedItem = 1; comp.difficultyRange = '1 week'
" id="1" #item1 [ngClass]="{ active: selectedItem == item1.id, txt_primay: true }">1 {{'home.WEEK' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '15 days', comp.Type); selectedItem = 2; comp.difficultyRange = '15 days'
" id="2" #item2 [ngClass]="{ active: selectedItem == item2.id, day15_txt: true }">15 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '30 days', comp.Type); selectedItem = 3; comp.difficultyRange = '30 days'
" id="3" #item3 [ngClass]="{ active: selectedItem == item3.id, day30_txt: true }">30 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '60 days', comp.Type); selectedItem = 4; comp.difficultyRange = '60 days'
" id="4" #item4 [ngClass]="{ active: selectedItem == item4.id, day60_txt: true }">60 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '3 months', comp.Type); selectedItem = 5; comp.difficultyRange = '3 months'
" id="5" #item5 [ngClass]="{ active: selectedItem == item5.id, day3m_txt: true }">3 {{'home.MONTHS' | translate}}</a>
</div>
<div class="day_filter" *ngIf="this.title=='Total Difficulty'">
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.difficultyRange,'cuckatoo'); selectedItem12 = 1
" id="1" #item121 [ngClass]="{ active: selectedItem12 == item121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.difficultyRange,'progpow'); selectedItem12 = 2
" id="2" #item122 [ngClass]="{ active: selectedItem12 == item122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.difficultyRange,'randomx'); selectedItem12 = 3
" id="3" #item123 [ngClass]="{ active: selectedItem12 == item123.id, txt_primay: true }">RandomX</a>
</div>
<div class="day_filter" *ngIf="this.title=='Transactions over time'">
<a href="JavaScript:void(0);" (click)="ChartFromView(GraphtDate, GraphtHour, GraphtInput,'Input'); selectedItem8 = 1" id="1" #item1
[ngClass]="{ active: selectedItem8 == item1.id, txt_primay: true }">{{'home.INPUT' | translate}}</a>
<a href="JavaScript:void(0);" (click)="ChartFromView(GraphtDate, GraphtHour, GraphtKernal,'Kernal'); selectedItem8 = 2" id="2" #item2
[ngClass]="{ active: selectedItem8 == item2.id, day15_txt: true }">{{'home.KERNELS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="ChartFromView(GraphtDate, GraphtHour, GraphtOutput,'Output'); selectedItem8 = 3" id="3" #item3
[ngClass]="{ active: selectedItem8 == item3.id, day30_txt: true }">{{'home.OUTPUT' | translate}}</a>
</div>
</div>
</div>
</div>
</div> -->
<div class="row">
<div class="col-md-9">
<div class="box_shadow_large bg-white p-3">
<div class="overflow-hidden">
<div class="blocks detail_graph">
<h2 class="chart_heading text-uppercase d-inline-block">
{{chartType | translate}}</h2>
<epic-explorer-plotly *ngIf="hashdata.data" [data]="hashdata.data" [layout]="hashdata.layout">
</epic-explorer-plotly>
<div class="day_filter" *ngIf="this.title!='Transactions over time'">
<a href="JavaScript:void(0);" *ngIf="this.title=='Total Difficulty' || this.title=='Target Difficulty'" (click)="
ChartFromView('', '', '1 day', comp.Type); selectedItem = 6; comp.difficultyRange = '1 day'
" id="6" #item6 [ngClass]="{ active: selectedItem == item6.id, txt_primay: true }">1 Day</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '1 week', comp.Type); selectedItem = 1; comp.difficultyRange = '1 week'
" id="1" #item1 [ngClass]="{ active: selectedItem == item1.id, txt_primay: true }">1
{{'home.WEEK' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '15 days', comp.Type); selectedItem = 2; comp.difficultyRange = '15 days'
" id="2" #item2 [ngClass]="{ active: selectedItem == item2.id, day15_txt: true }">15
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '30 days', comp.Type); selectedItem = 3; comp.difficultyRange = '30 days'
" id="3" #item3 [ngClass]="{ active: selectedItem == item3.id, day30_txt: true }">30
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '60 days', comp.Type); selectedItem = 4; comp.difficultyRange = '60 days'
" id="4" #item4 [ngClass]="{ active: selectedItem == item4.id, day60_txt: true }">60
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', '3 months', comp.Type); selectedItem = 5; comp.difficultyRange = '3 months'
" id="5" #item5 [ngClass]="{ active: selectedItem == item5.id, day3m_txt: true }">3
{{'home.MONTHS' | translate}}</a>
</div>
<div class="day_filter" *ngIf="this.title=='Target Difficulty'">
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.difficultyRange,'cuckatoo'); selectedItem12 = 1
" id="1" #item121 [ngClass]="{ active: selectedItem12 == item121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.difficultyRange,'progpow'); selectedItem12 = 2
" id="2" #item122 [ngClass]="{ active: selectedItem12 == item122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.difficultyRange,'randomx'); selectedItem12 = 3
" id="3" #item123 [ngClass]="{ active: selectedItem12 == item123.id, txt_primay: true }">RandomX</a>
</div>
<div class="day_filter" *ngIf="this.title=='Total Difficulty'">
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.TdifficultyRange,'cuckatoo'); selectedItem12 = 1
" id="1" #item121 [ngClass]="{ active: selectedItem12 == item121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.TdifficultyRange,'progpow'); selectedItem12 = 2
" id="2" #item122 [ngClass]="{ active: selectedItem12 == item122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
ChartFromView('', '', comp.TdifficultyRange,'randomx'); selectedItem12 = 3
" id="3" #item123 [ngClass]="{ active: selectedItem12 == item123.id, txt_primay: true }">RandomX</a>
</div>
<div class="day_filter" *ngIf="this.title=='Transactions over time'">
<a href="JavaScript:void(0);"
(click)="ChartFromView(GraphtDate, GraphtHour, GraphtInput,'Input'); selectedItem8 = 1" id="1" #item1
[ngClass]="{ active: selectedItem8 == item1.id, txt_primay: true }">{{'home.INPUT' | translate}}</a>
<a href="JavaScript:void(0);"
(click)="ChartFromView(GraphtDate, GraphtHour, GraphtKernal,'Kernal'); selectedItem8 = 2" id="2"
#item2
[ngClass]="{ active: selectedItem8 == item2.id, day15_txt: true }">{{'home.KERNELS' | translate}}</a>
<a href="JavaScript:void(0);"
(click)="ChartFromView(GraphtDate, GraphtHour, GraphtOutput,'Output'); selectedItem8 = 3" id="3"
#item3
[ngClass]="{ active: selectedItem8 == item3.id, day30_txt: true }">{{'home.OUTPUT' | translate}}</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div *ngIf="TimeArr" class="box_shadow_large detail_div p-3 mb-4">
<!-- <h1 class="test_msg align-middle mr-3 pl-3">{{'home.HEADER_TEXT' | translate}}</h1> -->
<!-- <h1 class="test_msg align-middle mb-0 pl-3">{{'home.COUNTDOWN' | translate}}
<div *ngIf="TimeArr" class="box_shadow_large detail_div p-3 mb-4">
<!-- <h1 class="test_msg align-middle mr-3 pl-3">{{'home.HEADER_TEXT' | translate}}</h1> -->
<!-- <h1 class="test_msg align-middle mb-0 pl-3">{{'home.COUNTDOWN' | translate}}
<ul class="list-unstyled mt-2 mb-0 txt_primary">
<li class="d-inline-block"><span id="days">{{TimeArr.d}}d:</span></li>
<li class="d-inline-block"><span id="hours">{{TimeArr.h}}h:</span></li>
@ -68,74 +147,37 @@
<li class="d-inline-block"><span id="seconds">{{TimeArr.s}}s</span></li>
</ul>
</h1> -->
</div>
<div class="box_shadow_large bg-white p-3">
<h2 class="chart_heading mb-2 d-inline-block">{{'home.EXPLORE' | translate}}</h2>
<ul class="list-unstyled pl-3">
<li class="mb-1" *ngIf="this.title!='Total Difficulty'"><a routerLink="/chart/difficulty">{{'home.DIFFICULTY' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Transactions over time'"><a routerLink="/chart/transactions-by-time">{{'home.TRANSACTIONS_BY_TIME' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Blocks'"><a routerLink="/chart/blocks">{{'home.BLOCKS' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Blocks Mined'"><a routerLink="/chart/blocks-mined">{{'home.BLOCKS_MINED' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Transaction Fees'"><a routerLink="/chart/transaction-fees">{{'home.TRANSACTION_FEES' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Supply Growth'"><a routerLink="/chart/supply-growth">{{'home.SUPPLY_GROWTH' | translate}}</a></li>
<!-- <li class="mb-1" *ngIf="this.title!='HashRate Growth Chart'"><a routerLink="/chart/hashrate-growth-chart">{{'home.HASHRATE_GROWTH_CHART' | translate}}</a></li> -->
<li class="mb-1" *ngIf="this.title!='Transactions over time'"><a routerLink="/chart/block-interval">{{'home.BLOCK_INTERVAL' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Transactions by Date'"><a routerLink="/chart/transactions-vs-date">{{'home.TRANSACTIONS_VS_DATE' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Stackbar Chart'"><a routerLink="/chart/stackchart">Stackbar Chart</a></li>
<!-- <li class="mb-1" *ngIf="this.title!='Pie Chart'"><a routerLink="/chart/piechart">Pie Chart</a></li> -->
</ul>
</div>
</div>
<div class="box_shadow_large bg-white p-3">
<h2 class="chart_heading mb-2 d-inline-block">{{'home.EXPLORE' | translate}}</h2>
<ul class="list-unstyled pl-3">
<li class="mb-1" *ngIf="this.title!='Target Difficulty'"><a
routerLink="/chart/target-difficulty">{{'target-difficulty' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Total Difficulty'"><a
routerLink="/chart/total-difficulty">{{'total-difficulty' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Transactions over time'"><a
routerLink="/chart/transactions-by-time">{{'home.TRANSACTIONS_BY_TIME' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Blocks'"><a
routerLink="/chart/blocks">{{'home.BLOCKS' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Blocks Mined'"><a
routerLink="/chart/blocks-mined">{{'home.BLOCKS_MINED' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Transaction Fees'"><a
routerLink="/chart/transaction-fees">{{'home.TRANSACTION_FEES' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Supply Growth'"><a
routerLink="/chart/supply-growth">{{'home.SUPPLY_GROWTH' | translate}}</a></li>
<!-- <li class="mb-1" *ngIf="this.title!='HashRate Growth Chart'"><a routerLink="/chart/hashrate-growth-chart">{{'home.HASHRATE_GROWTH_CHART' | translate}}</a></li> -->
<li class="mb-1" *ngIf="this.title!='Transactions over time'"><a
routerLink="/chart/block-interval">{{'home.BLOCK_INTERVAL' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Transactions by Date'"><a
routerLink="/chart/transactions-vs-date">{{'home.TRANSACTIONS_VS_DATE' | translate}}</a></li>
<li class="mb-1" *ngIf="this.title!='Stackbar Chart'"><a routerLink="/chart/stackchart">Stackbar Chart</a>
</li>
<!-- <li class="mb-1" *ngIf="this.title!='Pie Chart'"><a routerLink="/chart/piechart">Pie Chart</a></li> -->
</ul>
</div>
</div>
</div>
<div *ngIf="this.title=='Total Difficulty'" class="row mt-3">
<div class="col-md-9">
<div class="box_shadow_large bg-white p-3">
<div class="overflow-hidden">
<div class="blocks detail_graph">
<h2 class="chart_heading text-uppercase d-inline-block">Total Difficulty</h2>
<epic-explorer-plotly *ngIf="linearTotalGraphData.data" [data]="linearTotalGraphData.data" [layout]="linearTotalGraphData.layout">
</epic-explorer-plotly>
<div class="day_filter diff_margin">
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '1 day',''); selectedTarget = 6; TdifficultyRange = '1 day'
" id="6" #itemtarget6 [ngClass]="{ active: selectedTarget == itemtarget6.id, txt_primay: true }">1 Day</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '1 week',''); selectedTarget = 1; TdifficultyRange = '1 week'
" id="1" #itemtarget1 [ngClass]="{ active: selectedTarget == itemtarget1.id, txt_primay: true }">1 {{'home.WEEK' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '15 days',''); selectedTarget = 2; TdifficultyRange = '15 days'
" id="2" #itemtarget2 [ngClass]="{ active: selectedTarget == itemtarget2.id, day15_txt: true }">15 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '30 days',''); selectedTarget = 3; TdifficultyRange = '30 days'
" id="3" #itemtarget3 [ngClass]="{ active: selectedTarget == itemtarget3.id, day30_txt: true }">30 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '60 days',''); selectedTarget = 4; TdifficultyRange = '60 days'
" id="4" #itemtarget4 [ngClass]="{ active: selectedTarget == itemtarget4.id, day60_txt: true }">60 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', '3 months',''); selectedTarget = 5; TdifficultyRange = '3 months'
" id="5" #itemtarget5 [ngClass]="{ active: selectedTarget == itemtarget5.id, day3m_txt: true }">3 {{'home.MONTHS' | translate}}</a>
</div>
<div class="day_filter">
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', TdifficultyRange,'cuckatoo'); selectedTarget12 = 1
" id="1" #itemtarget121 [ngClass]="{ active: selectedTarget12 == itemtarget121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', TdifficultyRange,'progpow'); selectedTarget12 = 2
" id="2" #itemtarget122 [ngClass]="{ active: selectedTarget12 == itemtarget122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
totalDifficultyreq('', '', TdifficultyRange,'randomx'); selectedTarget12 = 3
" id="3" #itemtarget123 [ngClass]="{ active: selectedTarget12 == itemtarget123.id, txt_primay: true }">RandomX</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -55,20 +55,35 @@ export class GraphDetailComponent implements OnInit {
this.chartType = params['hashid'];
//console.log(this.chartType);
switch(this.chartType){
case 'difficulty':
this.totalDifficultyreq();
this.comp.Difficultyreq().then(res => {
this.hashdata = this.comp.linearGraphData;
case 'total-difficulty':
// this.totalDifficultyreq();
this.comp.Difficultyreq('total').then(res => {
this.hashdata = this.comp.linearTotalGraphData;
console.log('this.comp.linearTotalGraphData',this.comp.linearTotalGraphData);
this.hashdata.layout.height = 500;
this.title = 'Total Difficulty';
this.selectedItem = 6;
this.selectedTarget = 6;
this.titleService.setTitle(
this.route.snapshot.data.title + ' - ' + this.title,
);
//console.log(this.hashdata);
});
break;
case 'target-difficulty':
// this.totalDifficultyreq();
this.comp.Difficultyreq('target').then(res => {
this.hashdata = this.comp.linearGraphData;
console.log('this.comp.linearGraphData',this.comp.linearGraphData);
this.hashdata.layout.height = 500;
this.title = 'Target Difficulty';
this.selectedItem = 6;
this.titleService.setTitle(
this.route.snapshot.data.title + ' - ' + this.title,
);
//console.log(this.hashdata);
});
break;
case 'transactions-by-time':
this.comp.Transactionheatmapreq().then(res => {
this.hashdata = this.comp.heatMapGrowthData;
@ -200,13 +215,20 @@ export class GraphDetailComponent implements OnInit {
) {
// (p1, p2, p3, p4, p5) for (fromDate, ToDate, interval, fordifficult, forblocks) for difficult and nar chart
// AND For heatmap and others - It will change
this.comp.Type = p4 != '' ? p4 : this.comp.Type == '' ? 'cuckatoo' : this.comp.Type;
this.comp.Type = p4 != '' && (p4 == 'cuckatoo' || p4 == 'progpow' || p4 == 'randomx') ? p4 : this.comp.Type == '' ? 'cuckatoo' : this.comp.Type;
switch (this.chartType) {
case 'difficulty':
this.comp.Difficultyreq(p1, p2, p3, p4).then(res => {
case 'target-difficulty':
this.comp.Difficultyreq('target',p1, p2, p3, p4).then(res => {
this.hashdata = this.comp.linearGraphData;
this.hashdata.layout.height = 500;
this.title = 'Target Difficulty';
});
break;
case 'total-difficulty':
this.comp.Difficultyreq('total',p1, p2, p3, p4).then(res => {
this.hashdata = this.comp.linearTotalGraphData;
this.hashdata.layout.height = 500;
this.title = 'Total Difficulty';
});
break;
@ -221,7 +243,7 @@ export class GraphDetailComponent implements OnInit {
});
break;
case 'blocks':
this.comp.Difficultyreq(p1, p2, p3).then(res => {
this.comp.blockreq(p1, p2, p3).then(res => {
this.hashdata = this.comp.barGraphData;
this.hashdata.layout.height = 500;
this.title = 'Blocks';
@ -296,74 +318,46 @@ export class GraphDetailComponent implements OnInit {
}
}
totalDifficultyreq(
fromDate = '',
ToDate = '',
interval = '',
type = ''
) {
this.Type = type != '' ? type : this.Type == '' ? 'cuckatoo' : this.Type;
return new Promise((resolve, reject) => {
let params = new HttpParams();
params = params.append('FromDate', fromDate);
params = params.append('ToDate', ToDate);
params = params.append('Interval', interval);
params = params.append('Type', this.Type);
params = params.append('Difftype', 'total');
this.chartService
.apiGetRequest(params, '/blockchain_block/totaldiff')
.subscribe(
res => {
if (res['status'] == 200) {
let DifficultychartDate = res.response.Date;
let TargetDifficulty = res.response.TargetDifficulty;
this.totaldifficultyChartFunc(
DifficultychartDate,
TargetDifficulty,
this.Type
);
resolve();
}
},
error => {},
);
});
}
totaldifficultyChartFunc(DifficultychartDate, TargetDifficulty, Type) {
this.linearTotalGraphData = {
data: [
{
x: DifficultychartDate,
y: TargetDifficulty,
text: TargetDifficulty,
mode: 'lines+markers',
type: 'scatter',
name: '',
line: { color: '#ac3333' },
hovertemplate: '%{x}<br> Difficulty : %{text:,}',
},
],
layout: {
hovermode: 'closest',
height: 250,
autosize: true,
showlegend: false,
xaxis: {
tickangle: -45,
tickformat: '%m-%d',
},
yaxis: {
title: 'Diff',
},
margin: {
l: 50,
r: 50,
b: 50,
t: 50,
},
},
};
}
// totaldifficultyChartFunc(DifficultychartDate, TargetDifficulty, Type, range) {
// this.linearTotalGraphData = {
// data: [
// {
// x: DifficultychartDate,
// y: TargetDifficulty,
// text: TargetDifficulty,
// mode: 'lines+markers',
// type: 'scatter',
// name: '',
// line: { color: '#ac3333' },
// hovertemplate: '%{x}<br> Difficulty : %{text:,}',
// },
// ],
// layout: {
// hovermode: 'closest',
// height: 500,
// autosize: true,
// showlegend: false,
// xaxis: {
// tickangle: -45,
// tickformat: '%m-%d',
// fixedrange: true,
// showgrid: true
// },
// yaxis: {
// title: 'Diff',
// fixedrange: true,
// showgrid: true,
// range: range
// },
// margin: {
// l: 50,
// r: 50,
// b: 50,
// t: 50,
// },
// },
// };
// }
}

View File

@ -25,42 +25,113 @@
</div>
<div class="day_filter diff_margin">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', '1 day',''); selectedItem = 6; difficultyRange = '1 day'
Difficultyreq('target', '', '', '1 day',''); selectedItem = 6; difficultyRange = '1 day'
" id="6" #item6 [ngClass]="{ active: selectedItem == item6.id, txt_primay: true }">1 Day</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', '1 week',''); selectedItem = 1; difficultyRange = '1 week'
Difficultyreq('target', '', '', '1 week',''); selectedItem = 1; difficultyRange = '1 week'
" id="1" #item1 [ngClass]="{ active: selectedItem == item1.id, txt_primay: true }">1 {{'home.WEEK' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', '15 days',''); selectedItem = 2; difficultyRange = '15 days'
Difficultyreq('target', '', '', '15 days',''); selectedItem = 2; difficultyRange = '15 days'
" id="2" #item2 [ngClass]="{ active: selectedItem == item2.id, day15_txt: true }">15 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', '30 days',''); selectedItem = 3; difficultyRange = '30 days'
Difficultyreq('target', '', '', '30 days',''); selectedItem = 3; difficultyRange = '30 days'
" id="3" #item3 [ngClass]="{ active: selectedItem == item3.id, day30_txt: true }">30 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', '60 days',''); selectedItem = 4; difficultyRange = '60 days'
Difficultyreq('target', '', '', '60 days',''); selectedItem = 4; difficultyRange = '60 days'
" id="4" #item4 [ngClass]="{ active: selectedItem == item4.id, day60_txt: true }">60 {{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', '3 months',''); selectedItem = 5; difficultyRange = '3 months'
Difficultyreq('target', '', '', '3 months',''); selectedItem = 5; difficultyRange = '3 months'
" id="5" #item5 [ngClass]="{ active: selectedItem == item5.id, day3m_txt: true }">3 {{'home.MONTHS' | translate}}</a>
</div>
<div class="explore_all text-right">
<div class="d-inline float-left difficulty_filter day_filter p-0 bg-transparent">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', difficultyRange,'cuckatoo'); selectedItem12 = 1
Difficultyreq('target', '', '', difficultyRange,'cuckatoo'); selectedItem12 = 1
" id="1" #item121 [ngClass]="{ active: selectedItem12 == item121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', difficultyRange,'progpow'); selectedItem12 = 2
Difficultyreq('target', '', '', difficultyRange,'progpow'); selectedItem12 = 2
" id="2" #item122 [ngClass]="{ active: selectedItem12 == item122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('', '', difficultyRange,'randomx'); selectedItem12 = 3
Difficultyreq('target', '', '', difficultyRange,'randomx'); selectedItem12 = 3
" id="3" #item123 [ngClass]="{ active: selectedItem12 == item123.id, txt_primay: true }">RandomX</a>
</div>
<a routerLink="/chart/difficulty"><span class="text-uppercase">{{'home.EXPLORE_IT' | translate}} <i
<a routerLink="/chart/target-difficulty"><span class="text-uppercase">{{'home.EXPLORE_IT' | translate}} <i
class="fa fa-long-arrow-right"></i></span></a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="box_shadow">
<div class="blocks">
<h2 class="chart_heading d-inline-block">{{'home.TOTAL_DIFFICULTY' | translate}}</h2>
<!-- <span class="txn_count" *ngIf="this.lg_last.length > 0"><span *ngFor="let l of lg_last">{{
this.l | number</span>
}}</span> -->
<div class="chart_show">
<epic-explorer-plotly *ngIf="linearTotalGraphData.data" [data]="linearTotalGraphData.data"
[layout]="linearTotalGraphData.layout">
</epic-explorer-plotly>
<div *ngIf="!linearTotalGraphData.data" class="feedback_div news_desc text-center">
<div class="graph_img background_loading mx-auto mb-3"></div>
<div class=" p-3 bg-white">
<p class="mb-2 background_loading para_load"></p>
<p class="mb-2 background_loading para_load"></p>
<p class="mb-2 background_loading para_load"></p>
<p class="mb-2 background_loading para_load"></p>
<p class="mb-2 background_loading para_load"></p>
<p class="mb-2 background_loading para_load"></p>
<p class="mb-2 background_loading para_load"></p>
</div>
</div>
</div>
</div>
<div class="day_filter diff_margin">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '1 day',''); selectedTarget = 6; TdifficultyRange = '1 day'
" id="6" #itemtarget6 [ngClass]="{ active: selectedTarget == itemtarget6.id, txt_primay: true }">1 Day</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '1 week',''); selectedTarget = 1; TdifficultyRange = '1 week'
" id="1" #itemtarget1 [ngClass]="{ active: selectedTarget == itemtarget1.id, txt_primay: true }">1
{{'home.WEEK' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '15 days',''); selectedTarget = 2; TdifficultyRange = '15 days'
" id="2" #itemtarget2 [ngClass]="{ active: selectedTarget == itemtarget2.id, day15_txt: true }">15
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '30 days',''); selectedTarget = 3; TdifficultyRange = '30 days'
" id="3" #itemtarget3 [ngClass]="{ active: selectedTarget == itemtarget3.id, day30_txt: true }">30
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '60 days',''); selectedTarget = 4; TdifficultyRange = '60 days'
" id="4" #itemtarget4 [ngClass]="{ active: selectedTarget == itemtarget4.id, day60_txt: true }">60
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '3 months',''); selectedTarget = 5; TdifficultyRange = '3 months'
" id="5" #itemtarget5 [ngClass]="{ active: selectedTarget == itemtarget5.id, day3m_txt: true }">3
{{'home.MONTHS' | translate}}</a>
</div>
<div class="explore_all text-right">
<div class="d-inline float-left difficulty_filter day_filter p-0 bg-transparent">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'cuckatoo'); selectedTarget12 = 1
" id="1" #itemtarget121
[ngClass]="{ active: selectedTarget12 == itemtarget121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'progpow'); selectedTarget12 = 2
" id="2" #itemtarget122
[ngClass]="{ active: selectedTarget12 == itemtarget122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'randomx'); selectedTarget12 = 3
" id="3" #itemtarget123
[ngClass]="{ active: selectedTarget12 == itemtarget123.id, txt_primay: true }">RandomX</a>
</div>
<a routerLink="/chart/total-difficulty"><span class="text-uppercase">{{'home.EXPLORE_IT' | translate}} <i
class="fa fa-long-arrow-right"></i></span></a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="box_shadow">
<div class="blocks">

View File

@ -24,7 +24,8 @@ export class GraphListComponent implements OnInit {
public transcationGraphData: any = [];
public stackGraphData: any = [];
public pieGraphData: any = [];
public linearTotalGraphData: any = [];
public lg_last: any;
public ag_last: any = '';
public dg_last: any = '';
@ -49,6 +50,8 @@ export class GraphListComponent implements OnInit {
public selectedItem10: Number = 3;
public selectedItem11: Number = 3;
public selectedItem12: Number = 1;
public selectedTarget: Number = 6;
public selectedTarget12: Number = 1;
public tInput: any;
public tOutput: any;
@ -57,7 +60,8 @@ export class GraphListComponent implements OnInit {
public tHour: any;
public Type: any = '';
public difficultyRange: any = '1 day';
public TdifficultyRange: any = '1 day';
viewchartvar: boolean;
constructor(private chartService: ChartService, private http: HttpClient,public translate: TransServiceService, private router: Router,
@ -71,8 +75,8 @@ export class GraphListComponent implements OnInit {
ngOnInit() {
/* Total Difficulty and blocks chart fetching */
this.Difficultyreq();
this.Difficultyreq('target');
this.Difficultyreq('total');
this.blockreq();
/* Transcation fee chart fetching */
@ -376,6 +380,7 @@ export class GraphListComponent implements OnInit {
}
Difficultyreq(
difftype = '',
fromDate = '',
ToDate = '',
interval = '',
@ -388,6 +393,7 @@ export class GraphListComponent implements OnInit {
params = params.append('ToDate', ToDate);
params = params.append('Interval', interval);
params = params.append('Type', this.Type);
params = params.append('Difftype', difftype);
this.chartService
.apiGetRequest(params, '/blockchain_block/totaldiff')
.subscribe(
@ -396,13 +402,28 @@ export class GraphListComponent implements OnInit {
let DifficultychartDate = res.response.Date;
let BlocksChartDate = res.response.blockDate;
let TargetDifficulty = res.response.TargetDifficulty;
let range = [res.response.Minrange, res.response.Maxrange]
this.lg_last =
TargetDifficulty[TargetDifficulty.length - 1];
this.difficultyChartFunc(
DifficultychartDate,
TargetDifficulty,
this.Type
);
switch(difftype){
case 'total':
this.totaldifficultyChartFunc(
DifficultychartDate,
TargetDifficulty,
this.Type,
range
);
break;
case 'target':
this.difficultyChartFunc(
DifficultychartDate,
TargetDifficulty,
this.Type,
range
);
break;
}
resolve();
}
},
@ -439,7 +460,8 @@ export class GraphListComponent implements OnInit {
});
}
difficultyChartFunc(DifficultychartDate, TargetDifficulty, Type) {
difficultyChartFunc(DifficultychartDate, TargetDifficulty, Type, range) {
console.log('range rangerangerange@@@@@@@22444',range);
this.linearGraphData = {
data: [
{
@ -491,9 +513,14 @@ export class GraphListComponent implements OnInit {
xaxis: {
tickangle: -45,
tickformat: '%m-%d',
showgrid: true,
fixedrange: true
},
yaxis: {
title: 'Diff',
showgrid: true,
fixedrange: true,
range: range
},
margin: {
l: 50,
@ -574,7 +601,7 @@ export class GraphListComponent implements OnInit {
title: 'Blocks',
rangemode: 'nonnegative',
fixedrange: true,
showgrid: true,
showgrid: true
},
margin: {
l: 50,
@ -607,9 +634,13 @@ export class GraphListComponent implements OnInit {
xaxis: {
tickangle: -45,
tickformat: '%m-%d',
showgrid: true,
fixedrange: true
},
yaxis: {
title: 'Blocks',
showgrid: true,
fixedrange: true
},
margin: {
l: 50,
@ -647,9 +678,13 @@ export class GraphListComponent implements OnInit {
xaxis: {
tickangle: -45,
tickformat: '%m-%d',
showgrid: true,
fixedrange: true
},
yaxis: {
title: 'Blocks',
showgrid: true,
fixedrange: true
},
margin: {
l: 50,
@ -1032,10 +1067,13 @@ export class GraphListComponent implements OnInit {
showgrid: false,
zeroline: false,
tickformat: '%m-%d',
fixedrange: true
},
yaxis: {
showline: false,
title: 'Estimated Hashrate (GH/s)',
showgrid: true,
fixedrange: true
},
margin: {
l: 50,
@ -1048,4 +1086,44 @@ export class GraphListComponent implements OnInit {
options: null,
};
}
totaldifficultyChartFunc(DifficultychartDate, TargetDifficulty, Type, range) {
this.linearTotalGraphData = {
data: [
{
x: DifficultychartDate,
y: TargetDifficulty,
text: TargetDifficulty,
mode: 'lines+markers',
type: 'scatter',
name: '',
line: { color: '#ac3333' },
hovertemplate: '%{x}<br> Difficulty : %{text:,}',
},
],
layout: {
hovermode: 'closest',
height: 250,
autosize: true,
showlegend: false,
xaxis: {
tickangle: -45,
tickformat: '%m-%d',
fixedrange: true,
showgrid: true
},
yaxis: {
title: 'Diff',
fixedrange: true,
showgrid: true,
range: range
},
margin: {
l: 50,
r: 50,
b: 50,
t: 50,
},
},
};
}
}