lychiyu/bbgo_origin
1
0
Fork 0
mirror of https://github.com/c9s/bbgo.git synced 2024-09-20 08:11:08 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

backtest-report: add order list table and support visible range selection

Browse Source 
Signed-off-by: c9s <yoanlin93@gmail.com>
This commit is contained in:
c9s 2022-06-27 02:31:34 +08:00
parent f16fad4ca1
commit 2eca045245
No known key found for this signature in database
GPG Key ID: 7385E7E464CB0A54
1 changed files with 26 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
apps/backtest-report/components/TradingViewChart.tsx
View File

@ -5,7 +5,7 @@ import {Checkbox, Group, SegmentedControl, Table} from '@mantine/core';
// https://github.com/tradingview/lightweight-charts/issues/543
// const createChart = dynamic(() => import('lightweight-charts'));
import {createChart, CrosshairMode, MouseEventParams} from 'lightweight-charts';
import {createChart, CrosshairMode, MouseEventParams, TimeRange} from 'lightweight-charts';
import {ReportSummary} from "../types";
import moment from "moment";
@ -494,9 +494,6 @@ const TradingViewChart = (props: TradingViewChartProps) => {
}
chart.current.timeScale().fitContent();
chart.current.timeScale().scrollToPosition(20, true);
const visibleRange = chart.current.timeScale().getVisibleRange()
console.log("visibleRange", visibleRange)
/*
chart.current.timeScale().setVisibleRange({
@ -560,18 +557,40 @@ const TradingViewChart = (props: TradingViewChartProps) => {
</div>
<OrderListTable orders={orders}/>
<OrderListTable orders={orders} onClick={(order) => {
console.log("selected order", order);
const visibleRange = chart.current.timeScale().getVisibleRange()
const seconds = parseInterval(currentInterval)
const bars = 12
const orderTime = order.creation_time.getTime() / 1000
const from = orderTime - bars * seconds
const to = orderTime + bars * seconds
console.log("orderTime", orderTime)
console.log("visibleRange", visibleRange)
console.log("setVisibleRange", from, to, to - from)
chart.current.timeScale().setVisibleRange({ from, to } as TimeRange);
// chart.current.timeScale().scrollToPosition(20, true);
}}/>
</div>
);
};
interface OrderListTableProps {
orders: Order[];
onClick?: (order: Order) => void;
}
const OrderListTable = (props: OrderListTableProps) => {
const rows = props.orders.map((order: Order) => (
<tr key={order.order_id}>
<tr key={order.order_id} onClick={(e) => {
props.onClick ? props.onClick(order) : null;
const nodes = e.currentTarget?.parentNode?.querySelectorAll(".selected")
nodes?.forEach((node, i) => {
node.classList.remove("selected")
})
e.currentTarget.classList.add("selected")
}}>
<td>{order.order_id}</td>
<td>{order.symbol}</td>
<td>{order.side}</td>
@ -582,7 +601,7 @@ const OrderListTable = (props: OrderListTableProps) => {
<td>{order.creation_time.toString()}</td>
</tr>
));
return <Table>
return <Table highlightOnHover striped>
<thead>
<tr>
<th>Order ID</th>