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

Update chart colors.

Browse Source
This commit is contained in:
softsimon 2021-04-19 17:39:47 +04:00
parent 344d1247bd
commit 6b5b80f866
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
4 changed files with 30 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/bisq/bisq-dashboard/bisq-dashboard.component.ts
View File

@ -1,6 +1,6 @@
import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
import { Observable, combineLatest } from 'rxjs';
import { filter, map } from 'rxjs/operators';
import { map } from 'rxjs/operators';
import { SeoService } from 'src/app/services/seo.service';
import { StateService } from 'src/app/services/state.service';
import { WebsocketService } from 'src/app/services/websocket.service';

2
frontend/src/app/bisq/bisq-market/bisq-market.component.ts
View File

@ -82,7 +82,7 @@ export class BisqMarketComponent implements OnInit, OnDestroy {
return {
time: h.time,
value: h.volume_right,
color: h.close > h.avg ? 'rgba(0, 150, 136, 0.8)' : 'rgba(255,82,82, 0.8)',
color: h.close > h.avg ? 'rgba(0, 41, 74, 0.7)' : 'rgba(0, 41, 74, 1)',
};
})
};

4
frontend/src/app/bisq/lightweight-charts-area/lightweight-charts-area.component.scss
View File

@ -17,9 +17,9 @@
}
:host ::ng-deep .volumeText {
color: rgba(37, 177, 53, 1);
color: rgba(33, 150, 243, 0.7);
}
:host ::ng-deep .tradesText {
color: rgba(33, 150, 243, 1);
color: rgba(37, 177, 53, 1);
}

53
frontend/src/app/bisq/lightweight-charts-area/lightweight-charts-area.component.ts
View File

@ -24,7 +24,6 @@ export class LightweightChartsAreaComponent implements OnChanges, OnDestroy {
constructor(
private element: ElementRef,
) {
this.container = document.createElement('div');
const chartholder = this.element.nativeElement.appendChild(this.container);
@ -54,20 +53,20 @@ export class LightweightChartsAreaComponent implements OnChanges, OnDestroy {
},
});
this.areaSeries = this.chart.addAreaSeries({
topColor: 'rgba(33, 150, 243, 0.9)',
bottomColor: 'rgba(33, 150, 243, 0.1)',
lineColor: 'rgba(33, 150, 243, 1)',
lineWidth: 2,
});
this.lineSeries = this.chart.addLineSeries({
color: 'rgba(37, 177, 53, 1)',
lineColor: 'rgba(216, 27, 96, 1)',
lineWidth: 2,
});
var toolTip = document.createElement('div');
this.areaSeries = this.chart.addAreaSeries({
topColor: 'rgba(33, 150, 243, 0.7)',
bottomColor: 'rgba(33, 150, 243, 0.1)',
lineColor: 'rgba(33, 150, 243, 0.1)',
lineWidth: 2,
});
const toolTip = document.createElement('div');
toolTip.className = 'floating-tooltip-2';
chartholder.appendChild(toolTip);
@ -76,37 +75,37 @@ export class LightweightChartsAreaComponent implements OnChanges, OnDestroy {
toolTip.style.display = 'none';
return;
}
var dateStr = isBusinessDay(param.time)
const dateStr = isBusinessDay(param.time)
? this.businessDayToString(param.time)
: new Date(param.time * 1000).toLocaleDateString();
toolTip.style.display = 'block';
var price = param.seriesPrices.get(this.areaSeries);
var line = param.seriesPrices.get(this.lineSeries);
toolTip.innerHTML =
`<table><tr><td class="volumeText">Volume:<td class="text-right volumeText">${Math.round(price * 100) / 100} BTC</td></tr>
toolTip.style.display = 'block';
const price = param.seriesPrices.get(this.areaSeries);
const line = param.seriesPrices.get(this.lineSeries);
toolTip.innerHTML = `<table>
<tr><td class="tradesText"># of trades:</td><td class="text-right tradesText">${Math.round(line * 100) / 100}</td></tr>
<tr><td class="volumeText">Volume:<td class="text-right volumeText">${Math.round(price * 100) / 100} BTC</td></tr>
</table>
<div>${dateStr}</div>`;
var y = param.point.y;
var toolTipWidth = 100;
var toolTipHeight = 80;
var toolTipMargin = 15;
var left = param.point.x + toolTipMargin;
const y = param.point.y;
const toolTipWidth = 100;
const toolTipHeight = 80;
const toolTipMargin = 15;
let left = param.point.x + toolTipMargin;
if (left > this.width - toolTipWidth) {
left = param.point.x - toolTipMargin - toolTipWidth;
}
var top = y + toolTipMargin;
let top = y + toolTipMargin;
if (top > this.height - toolTipHeight) {
top = y - toolTipHeight - toolTipMargin;
}
toolTip.style.left = left + 'px';
toolTip.style.top = top + 'px';
});