niver code
This commit is contained in:
parent
2bdc7d3ab2
commit
e06b575e46
@ -2,8 +2,6 @@ const urlParams = new URLSearchParams(window.location.search);
|
|||||||
const symbol = urlParams.get('symbol');
|
const symbol = urlParams.get('symbol');
|
||||||
const time = urlParams.get('time');
|
const time = urlParams.get('time');
|
||||||
|
|
||||||
//window.dispatchEvent(new Event('resize'));
|
|
||||||
|
|
||||||
function timeToLocal(originalTime) {
|
function timeToLocal(originalTime) {
|
||||||
const d = new Date(originalTime * 1000);
|
const d = new Date(originalTime * 1000);
|
||||||
return Date.UTC(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours(), d.getMinutes(), d.getSeconds(), d.getMilliseconds()) / 1000;
|
return Date.UTC(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours(), d.getMinutes(), d.getSeconds(), d.getMilliseconds()) / 1000;
|
||||||
@ -41,6 +39,22 @@ function timeToLocal(originalTime) {
|
|||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getCrosshairDataPoint(series, param) {
|
||||||
|
if (!param.time) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
const dataPoint = param.seriesData.get(series);
|
||||||
|
return dataPoint || null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function syncCrosshair(chart, series, dataPoint) {
|
||||||
|
if (dataPoint) {
|
||||||
|
chart.setCrosshairPosition(dataPoint.value, dataPoint.time, series);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
chart.clearCrosshairPosition();
|
||||||
|
}
|
||||||
|
|
||||||
// Create the Lightweight Chart within the container element
|
// Create the Lightweight Chart within the container element
|
||||||
const chart = LightweightCharts.createChart(document.getElementById('container'),
|
const chart = LightweightCharts.createChart(document.getElementById('container'),
|
||||||
{
|
{
|
||||||
@ -50,13 +64,16 @@ function timeToLocal(originalTime) {
|
|||||||
},
|
},
|
||||||
|
|
||||||
height: 500,
|
height: 500,
|
||||||
|
|
||||||
crosshair: {
|
crosshair: {
|
||||||
mode: 0,
|
mode: 0,
|
||||||
},
|
},
|
||||||
|
|
||||||
timeScale: {
|
timeScale: {
|
||||||
timeVisible: true,
|
timeVisible: true,
|
||||||
secondsVisible: false,
|
secondsVisible: false,
|
||||||
},
|
},
|
||||||
|
|
||||||
layout: {
|
layout: {
|
||||||
background: {
|
background: {
|
||||||
type: 'solid',
|
type: 'solid',
|
||||||
@ -64,10 +81,12 @@ function timeToLocal(originalTime) {
|
|||||||
},
|
},
|
||||||
textColor: '#DDD',
|
textColor: '#DDD',
|
||||||
},
|
},
|
||||||
|
|
||||||
grid: {
|
grid: {
|
||||||
vertLines: { color: '#444' },
|
vertLines: { color: '#444' },
|
||||||
horzLines: { color: '#444' },
|
horzLines: { color: '#444' },
|
||||||
},
|
},
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
chart.applyOptions({
|
chart.applyOptions({
|
||||||
@ -78,8 +97,8 @@ function timeToLocal(originalTime) {
|
|||||||
vertAlign: 'left',
|
vertAlign: 'left',
|
||||||
color: '#DDD',
|
color: '#DDD',
|
||||||
text: symbol + " " + time,
|
text: symbol + " " + time,
|
||||||
}});
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// define chart
|
// define chart
|
||||||
const candleSeries = chart.addCandlestickSeries();
|
const candleSeries = chart.addCandlestickSeries();
|
||||||
@ -100,9 +119,11 @@ function timeToLocal(originalTime) {
|
|||||||
borderVisible: false
|
borderVisible: false
|
||||||
},
|
},
|
||||||
height: 200,
|
height: 200,
|
||||||
|
|
||||||
timeScale: {
|
timeScale: {
|
||||||
visible: false,
|
visible: false,
|
||||||
},
|
},
|
||||||
|
|
||||||
layout: {
|
layout: {
|
||||||
background: {
|
background: {
|
||||||
type: 'solid',
|
type: 'solid',
|
||||||
@ -110,6 +131,7 @@ function timeToLocal(originalTime) {
|
|||||||
},
|
},
|
||||||
textColor: '#DDD',
|
textColor: '#DDD',
|
||||||
},
|
},
|
||||||
|
|
||||||
grid: {
|
grid: {
|
||||||
vertLines: { color: '#444' },
|
vertLines: { color: '#444' },
|
||||||
horzLines: { color: '#444' },
|
horzLines: { color: '#444' },
|
||||||
@ -124,7 +146,8 @@ function timeToLocal(originalTime) {
|
|||||||
vertAlign: 'left',
|
vertAlign: 'left',
|
||||||
color: '#DDD',
|
color: '#DDD',
|
||||||
text: 'RSI 5,14,21',
|
text: 'RSI 5,14,21',
|
||||||
}});
|
}
|
||||||
|
});
|
||||||
|
|
||||||
const lineSeriesRSI5 = chartrsi.addLineSeries({ color: 'orange', lineWidth: 1, lineStyle: 2, priceLineVisible: false});
|
const lineSeriesRSI5 = chartrsi.addLineSeries({ color: 'orange', lineWidth: 1, lineStyle: 2, priceLineVisible: false});
|
||||||
const lineSeriesRSI14 = chartrsi.addLineSeries({ color: 'yellow', lineWidth: 2, priceLineVisible: false});
|
const lineSeriesRSI14 = chartrsi.addLineSeries({ color: 'yellow', lineWidth: 2, priceLineVisible: false});
|
||||||
@ -139,10 +162,12 @@ function timeToLocal(originalTime) {
|
|||||||
},
|
},
|
||||||
|
|
||||||
height: 200,
|
height: 200,
|
||||||
|
|
||||||
timeScale: {
|
timeScale: {
|
||||||
timeVisible: true,
|
timeVisible: true,
|
||||||
secondsVisible: false,
|
secondsVisible: false,
|
||||||
},
|
},
|
||||||
|
|
||||||
layout: {
|
layout: {
|
||||||
background: {
|
background: {
|
||||||
type: 'solid',
|
type: 'solid',
|
||||||
@ -150,6 +175,7 @@ function timeToLocal(originalTime) {
|
|||||||
},
|
},
|
||||||
textColor: '#DDD',
|
textColor: '#DDD',
|
||||||
},
|
},
|
||||||
|
|
||||||
grid: {
|
grid: {
|
||||||
vertLines: { color: '#444' },
|
vertLines: { color: '#444' },
|
||||||
horzLines: { color: '#444' },
|
horzLines: { color: '#444' },
|
||||||
@ -164,7 +190,8 @@ function timeToLocal(originalTime) {
|
|||||||
vertAlign: 'left',
|
vertAlign: 'left',
|
||||||
color: '#DDD',
|
color: '#DDD',
|
||||||
text: 'MACD 12 26',
|
text: 'MACD 12 26',
|
||||||
}});
|
}
|
||||||
|
});
|
||||||
|
|
||||||
const lineSeriesMACD = chartmacd.addLineSeries({ color: 'blue', lineWidth: 1, lineStyle: 0, priceLineVisible: false});
|
const lineSeriesMACD = chartmacd.addLineSeries({ color: 'blue', lineWidth: 1, lineStyle: 0, priceLineVisible: false});
|
||||||
const lineSeriesMACDSignal = chartmacd.addLineSeries({ color: 'orange', lineWidth: 1, lineStyle: 0, priceLineVisible: false});
|
const lineSeriesMACDSignal = chartmacd.addLineSeries({ color: 'orange', lineWidth: 1, lineStyle: 0, priceLineVisible: false});
|
||||||
@ -173,11 +200,9 @@ function timeToLocal(originalTime) {
|
|||||||
type: 'volume',
|
type: 'volume',
|
||||||
color: 'orange',
|
color: 'orange',
|
||||||
},
|
},
|
||||||
//priceScaleId: '', // set as an overlay by setting a blank priceScaleId
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
fetch("/botdata/asset-histories/" + symbol + ".history." + time + ".csv")
|
fetch("/botdata/asset-histories/" + symbol + ".history." + time + ".csv")
|
||||||
.then(response => response.text())
|
.then(response => response.text())
|
||||||
.then(data => {
|
.then(data => {
|
||||||
@ -304,22 +329,6 @@ function timeToLocal(originalTime) {
|
|||||||
chart.timeScale().setVisibleLogicalRange(timeRange);
|
chart.timeScale().setVisibleLogicalRange(timeRange);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
function getCrosshairDataPoint(series, param) {
|
|
||||||
if (!param.time) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
const dataPoint = param.seriesData.get(series);
|
|
||||||
return dataPoint || null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function syncCrosshair(chart, series, dataPoint) {
|
|
||||||
if (dataPoint) {
|
|
||||||
chart.setCrosshairPosition(dataPoint.value, dataPoint.time, series);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
chart.clearCrosshairPosition();
|
|
||||||
}
|
|
||||||
chart.subscribeCrosshairMove(param => {
|
chart.subscribeCrosshairMove(param => {
|
||||||
const dataPoint = getCrosshairDataPoint(lineSeriesEMA50, param);
|
const dataPoint = getCrosshairDataPoint(lineSeriesEMA50, param);
|
||||||
syncCrosshair(chartrsi, lineSeriesRSI14, dataPoint);
|
syncCrosshair(chartrsi, lineSeriesRSI14, dataPoint);
|
||||||
@ -331,7 +340,6 @@ chartrsi.subscribeCrosshairMove(param => {
|
|||||||
syncCrosshair(chart, lineSeriesEMA50, dataPoint);
|
syncCrosshair(chart, lineSeriesEMA50, dataPoint);
|
||||||
const dataPointmacd = getCrosshairDataPoint(lineSeriesRSI14, param);
|
const dataPointmacd = getCrosshairDataPoint(lineSeriesRSI14, param);
|
||||||
syncCrosshair(chartmacd, lineSeriesMACD, dataPointmacd);
|
syncCrosshair(chartmacd, lineSeriesMACD, dataPointmacd);
|
||||||
|
|
||||||
});
|
});
|
||||||
chartmacd.subscribeCrosshairMove(param => {
|
chartmacd.subscribeCrosshairMove(param => {
|
||||||
const dataPoint = getCrosshairDataPoint(lineSeriesMACD, param);
|
const dataPoint = getCrosshairDataPoint(lineSeriesMACD, param);
|
||||||
@ -339,4 +347,3 @@ chartmacd.subscribeCrosshairMove(param => {
|
|||||||
const dataPointrsi = getCrosshairDataPoint(lineSeriesMACD, param);
|
const dataPointrsi = getCrosshairDataPoint(lineSeriesMACD, param);
|
||||||
syncCrosshair(chartrsi, lineSeriesRSI14, dataPointrsi);
|
syncCrosshair(chartrsi, lineSeriesRSI14, dataPointrsi);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user