quant-zero
Version:
Node-Quant is a powerful Node.js package for developing and testing quantitative trading strategies in cryptocurrency markets, offering tools for backtesting and performance analysis.
77 lines (64 loc) • 2.37 kB
HTML
<html lang="en" class="w-full h-full">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Performance Report</title>
<script src="https://unpkg.com/@tailwindcss/browser@4"></script>
</head>
<body class="w-full h-full">
<div class="bg-slate-900 w-full h-full" id="chart-container"></div>
<div class="bg-slate-800 w-full h-1/2"></div>
<script type="module">
import {
CandlestickSeries,
createChart,
LineSeries,
} from 'lightweight-charts'
const chartContainer = document.querySelector('#chart-container')
const reportId = window.location.toString().split('/').at(-1)
async function chart() {
const chart = createChart(chartContainer, {
width: chartContainer.clientWidth,
height: chartContainer.clientHeight,
layout: { background: { type: 'solid', color: '#1c1917' } },
})
const priceDataResponse = await fetch(
`http://localhost:2555/${reportId}/price-data`,
).then((r) => r.json())
for (const dataSource of priceDataResponse) {
const { name, type, data: candles } = dataSource
const candleStickSeries = chart.addSeries(CandlestickSeries)
candleStickSeries.setData(
candles.map((candle) => {
return {
open: candle.at(1),
high: candle.at(2),
low: candle.at(3),
close: candle.at(4),
time: candle.at(0),
}
}),
)
}
const factorDataResponse = await fetch(
`http://localhost:2555/${reportId}/factor-data`,
).then((r) => r.json())
for (const dataSource of factorDataResponse) {
const { name, type, data } = dataSource
const lineSeries = chart.addSeries(LineSeries)
lineSeries.setData(
data.map((cell, cellIndex) => {
return {
time: priceDataResponse.at(0).data.at(cellIndex)[0],
value: cell,
}
}),
)
}
chart.timeScale().fitContent()
}
chart()
</script>
</body>
</html>